bei der Auswahl mit einer Option dynamisch ausgewählt

Question

Ich habe diesen Code:

HTML:

   <div class="row"> 

        <div class="col-md-6"> 

         <md-input-container> 
          <label>Country</label> 
          <md-select required ng-model="model.userCountry" id="res_country" name="res_country" ng-change="updateTimeZone(model.userCountry)" aria-label="select"> 
           <md-option ng-repeat="country in country" value="{{country.gid}}"> {{country.name}} </md-option> 
          </md-select> 
         </md-input-container> 

        </div> 

        <div class="col-md-6"> 

         <md-input-container id="timezone"> 
          <label>Timezone</label> 
          <md-select required ng-model="model.userZone" id="res_zone" name="res_zone" aria-label="select"> 
           <md-option ng-repeat="zone in zone" value="{{zone.gid}}"> {{zone.name}} </md-option> 
          </md-select> 
         </md-input-container> 

        </div> 
       </div> 

In meinen Controller-Funktionen Ich nehme die Liste der Zeitzonen auf der Grundlage des Land ausgewählt. Wenn ich ein Land auswähle, wenn es nur 1 Zeitzone gibt, wird es standardmäßig ausgewählt.

Mein Problem ist, dass, wenn ich die Ansicht mit einem zuvor gespeicherten Land und Zeitzone geladen habe, die Zeitzonenauswahl ng-empty und ng-invalid Klassen hat, und wenn ich dieselbe Option erneut auswähle, wird sie als Fehler markiert . Ein anderer Fall ist, wenn ich ein Land mit 2 oder mehr Zeitzonen auswähle und danach ein anderes Land mit nur 1 auswähle. Die Zeitzone wird ausgewählt, aber auch als Fehler markiert. Wie kann ich diese Klassen entfernen?

Answer 1

Ich habe gerade die erforderliche Stütze und habe diese stattdessen:

ng-required="!model.userZone" 

Damit wäre der Eingang nur als Fehler gekennzeichnet werden, wenn

kein ausgewählter Wert gibt es