2015-08-13 9 views
12

Mam skrypt here, a ng-pattern działa poprawnie, ponieważ scope.subnet jest wyświetlane w Output tylko po dopasowaniu wzorca pattern. Ale ng-show nie wyświetla żadnego błędu jeśli ng-wzór nie jest dopasowany

<body ng-contoller="myConfigGenCtr"> 
    <form novalidate name="myForm"> 
      <div class="form-group"> 
       <label for="hostname">Firewall hostname</label> 
       <input type="text" ng-model="hostname" class="form-control" id="hostname"> 
      </div> 
      <div class="form-group"> 
       <label for="subnet">Firewall subnet</label> 
       <input type="text" ng-model="subnet" class="form-control" id="subnet" 
         required ng-pattern="/^(?:[0-9]{1,3}\.){3}/" > 
       <div class="custom-error" ng-show="myForm.subnet.$error.pattern"> 
        Not a valid subnet, should be i.e. 10.x.y. (3 bytes only)</div> 
      </div> 
     </form> 
    <div>Output: {{subnet}}</div>  
</body> 
+1

co wzorzec powinien pasować? czy mógłbyś podać przykład? –

+0

tj. 1.1.1. wyświetla się dobrze. Ale jeśli piszę 1.1 błąd nie pokazuje się – irom

Odpowiedz

19

Po dodaniu formularz tag ze swoją nazwą, kątowe robi stworzyć scope zmienną dla tej wartości name atrybutu & nie dodać wszystkie formy pola formularza o atrybutach name. Te zmienne atrybutów pól są tworzone wewnątrz obiektu zasięgu formularza. Tak jak tutaj, używasz myForm, co oznacza, że ​​$scope.myFrom ma wszystkie informacje o polach formularza. jak jej obowiązywania, stosując $valid, $invalid, $error itp

Tutaj używasz ng-show="myForm.subnet.$error.pattern" na subnet elementu formularza. Nie udało Ci się dodać atrybutu name="subnet" w polu wejściowym, które okazało się, że walidacja elementu nie jest dostępna wewnątrz zmiennej zasięgu .

Markup

<input type="text" name="subnet" ng-model="subnet" class="form-control" 
id="subnet" required ng-pattern="/^(?:[0-9]{1,3}\.){3}/" > 

Working Plunkr

+0

Bardzo miła i prosta odpowiedź, dzięki @Pankaj, brakowało wywoływania go na wzorzec attr. Nie wiedziałem, że możesz to zrobić. – alphapilgrim

+0

@alphapilgrim Cieszę się, że to ci pomogło. Dzięki i pozdrawiam;) –

+0

Ruszaj! To działa. –