Search code examples
angularjscomparisonangularjs-ng-repeathtml-select

ng-selected inside of ng-repeat not working (AngularJS)


I'm trying to make a comparison of values to "check" an <option> tag inside of my <select> tag, but can't find a solution...

*This is an administration page, so I already have the {{x.nivel}} value. I just need to mark it as "selected" according to each "inscritos" from ng-repeat.

Help :\

            <li ng-repeat="x in inscritos | orderBy:'nome'">
                <select>
                    <option ng-selected="(this.value)=={{x.nivel}}" value="Iniciante">Iniciante</option>
                    <option ng-selected="(this.value)=={{x.nivel}}" value="Intermediário">Intermediário</option>
                    <option ng-selected="(this.value)=={{x.nivel}}" value="Avançado">Avançado</option>
                </select>
        </li>

Solution

  • Don't use {{}} in js expression:

     <li ng-repeat="x in inscritos | orderBy:'nome'">
        <select>
           <option ng-selected="x.nivel=='Iniciante'" value="Iniciante">Iniciante</option>
           <option ng-selected="x.nivel=='Intermediário'" value="Intermediário">Intermediário</option>
           <option ng-selected="x.nivel=='Avançado'" value="Avançado">Avançado</option>
         </select>
     </li>
    

    The double curly brace notation {{ }} is used to bind values with html elements. See templates docs.