Входы угловой формы в массив с валидацией

Question

Есть ли способ в угловом js, чтобы направить список менеджеров (или любой элемент) в массив с проверкой в ​​угловом. Я в основном хочу создать массив в качестве модели ng и все еще проверять его. Можно ли это сделать, или я иду об этом неправильно?

var app = angular.module("FormTest",[]); 
 
    app.controller("AppCtrl", ["$scope", function($scope){ 
 

 
     var appCtrl = this; 
 
     appCtrl.appName = "Form Array"; 
 
     $scope.managers = [""]; 
 
     $scope.form = {}; 
 
     $scope.form.managers = $scope.managers; 
 

 
     $scope.addManager = function(){ 
 

 
      $scope.managers.push(''); 
 
     } 
 

 
     $scope.removeManager = function(index){ 
 

 
      if($scope.managers.length > 1){ 
 

 
       $scope.managers.splice(index, 1); 
 

 
      } 
 
     } 
 

 
    }]) 
 

 
    angular.element(document).ready(function(){ 
 
     angular.bootstrap(document.querySelector('html'), ["FormTest"]); 
 
    })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
 
    <div ng-controller="AppCtrl as app"> 
 
     <h2>{{app.appName}}</h2> 
 
     <div> 
 
      {{form.managers}} 
 
      <div> 
 
       <div>{{managers}}</div> 
 
       <div class="btn btn-primary" ng-click="addManager()">add manager</div> 
 
      </div> 
 
     </div> 
 
     <form novalidate name="form"> 
 
      <div class="form-group" ng-repeat="item in managers track by $index"> 
 
       <div class="row-fluid"> 
 
        <div class="col-md-5"> 
 
         <input type="text" ng-model="managers[$index]" ng-pattern="/\w{3,}/" required class="form-control"> 
 
        </div> 
 
        <div class="col-md-1"> 
 
         <div class="btn btn-default"> 
 
          <span class="glyphicon glyphicon-remove-circle" ng-click="removeManager($index)"></span> 
 
         </div> 
 
        </div> 
 
       </div> 
 
      </div> 
 

 
     </form> 
 
    </div>

Answer 1

В вашем примере, все в порядке, для этого регулярного выражения, кроме.

Посмотрите на примерный код jsfiddle.

<h2>{{app.appName}}</h2> 
<div> 
    {{form.managers}} 
    <div> 
    <div>{{managers}}</div> 
    <button class="btn btn-primary" ng-click="addManager()">add manager</button> 
    </div> 
</div> 
<form novalidate name="form"> 
    Form valid={{form.$valid|json}} 
    <div class="form-group" ng-repeat="item in managers track by $index"> 
    <div class="row-fluid"> 
     <div class="col-md-5"> 
     <input type="text" ng-model="managers[$index]" name="manager{{$index}}" ng-pattern="/^\w{3,}$/" required class="form-control"> 
     {{form['manager'+$index].$error}} 
     </div> 
     <div class="col-md-1"> 
     <div class="btn btn-default"> 
      <button class="glyphicon glyphicon-remove-circle" ng-click="removeManager($index)">Remove</button> 
     </div> 
     </div> 
    </div> 
    </div> 

</form>