Ng-repeat in Sightly

Question

I am trying to populate drop-down values using ng-repeat in Sightly. The AEM node saves my data as String array and I am able to fetch it properly, but not able to populate them as it throws "? undefined:undefined ?" error.

My code:

<select name="${validation.elementName}" id="${validation.elementName}" ng-model="${validation.elementName}" ng-change="${properties.clickfunction}">
        <option ng-repeat="opt in ${properties.options}" value={{opt}}>opt</option>                 
        </select>

And the output:

:

Is there anything I am missing? As Sightly is totally new to me. I will be very grateful for any help to improve this code or pointing my mistake.

Answer 1

First of all, you need to wrap the data you pass to value in quotes, so it should be like this:

value="{{opt}}" 

Second, it looks like you are passing the values without single quotes and they are not being recognized as strings. Take a look at this plunker:

http://plnkr.co/edit/A2gZJbvVV9ozHloLkF4B?p=preview

You can see that the first ng-repeat works as expected, but the second throws an error in the console and doesn't display anything. Basically, you just need to put quotes around each string in your array.

Answer 2

Thanks @Victor for your reply.

Please find my below findings.

1. value="{{opt}}" was my mistake while pasting the code to stackoverflow.
2. ${properties.options} returns string array.
3. ng-repeat seems to parse correctly as per this output.