Using Aurelia, is it possible to use a variable name to dynamically reference a model object's property name?

Javascript:

dow = ['monday', 'tuesday', 'wednesday', 'thursday', 'friday'];
test = {
    monday:     false,
    tuesday:    false,
    wednesday:  false,
    thursday:   false,
    friday:     false,
};

HTML:

<label repeat.for="day of dow"><input type="checkbox" class="form-control" checked.bind="test[day]" />${day}</label>

This results in: "TypeError: obj is undefined"

Using Aurelia, is it possible to use a variable name to dynamically reference a model object's property name?

Javascript:

dow = ['monday', 'tuesday', 'wednesday', 'thursday', 'friday'];
test = {
    monday:     false,
    tuesday:    false,
    wednesday:  false,
    thursday:   false,
    friday:     false,
};

HTML:

<label repeat.for="day of dow"><input type="checkbox" class="form-control" checked.bind="test[day]" />${day}</label>

This results in: "TypeError: obj is undefined"

• javascript
• aurelia

Share Improve this question Follow edited Sep 1, 2015 at 2:46 billcobbler asked Sep 1, 2015 at 2:02 billcobblerbillcobbler 31511 silver badge88 bronze badges 0

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 8

According to the Aurelia Docs:

Each item that is being repeated by the repeat attribute has several special contextual values available for binding:

$parent - At present, the main view model's properties and methods are not visible from within the repeated item. We hope to remedy this in an update soon. For the mean time, you can access that view-model with $parent.

$index - The index of the item in the array.

$first - True if the item is the first item in the array.

$last - True if the item is the last item in the array.

$even - True if the item has an even numbered index.

$odd - True if the item has an odd numbered index.

It worked after updating the HTML to reference parent.new_deal[day]:

<label repeat.for="day of dow"><input type="checkbox" class="checkbox-inline" checked.bind="$parent.new_deal[day]" />${day}</label>