CODEWITHSUNDEEP
angularjs
MeLight
MeLight

Reputation: 5575

$index behaves differently when used as array index

I'm trying to use $index as an index (sorry) of an array defined in the controller. It's not working, and the $index becomes undefined (NaNndex).

For example, this code works fine:

<div ng-repeat="size in size_list">
    <input ng-model="$parent.appdata.size" id="size_event_[[$index]]" type="radio" name="event_button_size" value="[[size]]" style="vertical-align: top; margin: 0 3px 0 0; left: 5px">
    <label for="size_event_[[$index]]">[[size_list[0] + '' +$index]] </label>// <----- this part works as expected
</div>

Now, if I change the code [[size_list[0] + '' +$index]] to [[size_list[$index]]], like this:

<div ng-repeat="size in size_list">
    <input ng-model="$parent.appdata.size" id="size_event_[[$index]]" type="radio" name="event_button_size" value="[[size]]" style="vertical-align: top; margin: 0 3px 0 0; left: 5px">
    <label for="size_event_[[$index]]">[[size_list[$index]]] </label>
</div>

it breaks, giving me this error:

Syntax Error: Token 'undefined' is unexpected, expecting []] at column null of the expression [size_list[NaNndex] starting at [{4}].

Please advise.

Upvotes: 0

Views: 64

Answers (1)

Sharikov Vladislav
Sharikov Vladislav

Reputation: 7279

Why do you use [[ ]] everywhere? Templates must be binded throught {{ }}.

You need this:

<div ng-repeat="item in items">
  <label for="{{ 'id' + '[' + $index + ']'}}">{{ item }}</label>
  <input id="{{ 'id' + '[' + $index + ']'}}" />
</div>

Working example

Upvotes: 1

Related Questions