CODEWITHSUNDEEP
javascriptjqueryhtmlangularjs
Alvaro Silvino
Alvaro Silvino

Reputation: 9733

Angular unknow tag generated

I'm doing a select with this code:

Why this option tag is being generated ?

 <option value="? string:feminino ?"></option>

it only happens when:

  1. I select a option from the select
  2. I make the url updated with the gender
  3. Then refresh. (trying to auto select with the option on the url)

html before :

  <select id="gender" ng-model="genderMarked" ng-change="updateGender(genderMarked)" >
                            <option value="">Select a gender</option>

                            <option ng-value="collection.slug" ng-repeat="collection in collectionsGender">{{collection.title}}</option>
                        </select>

Html after:

     <select id="gender" ng-model="genderMarked" ng-change="updateGender(genderMarked)" class="ng-pristine ng-valid ng-touched"><option value="? string:feminino ?"></option>
            <option value="? string:feminino ?"></option>

            <option value="">Select a gender</option>

            <option ng-value="collection.slug" ng-repeat="collection in collectionsGender" class="ng-binding ng-scope" value="masculino">Masculino</option>

           <option ng-value="collection.slug" ng-repeat="collection in collectionsGender" class="ng-binding ng-scope" value="feminino">Feminino</option>

          <option ng-value="collection.slug" ng-repeat="collection in collectionsGender" class="ng-binding ng-scope" value="infantil">Infantil</option>
    </select>

And I'm getting the gender already marked from the url (if user refresh the page) with this code:

       if($stateParams.genderSlug){
            $scope.genderMarked = $stateParams.genderSlug;
        }else{
            $scope.genderMarked =  '';
        }

Upvotes: 0

Views: 32

Answers (1)

Phil
Phil

Reputation: 164733

I find ng-options to be much easier to use than repeated <option> tags.

Try this

<select id="gender" ng-model="genderMarked" ng-change="updateGender(genderMarked)"
        ng-options="collection.slug as collection.title for collection in collectionsGender">
    <option value="">Select a gender</option>
</select>

Upvotes: 1

Related Questions