2017-06-14 14 views
2

具有输入AngularJS输入有效的,如果值是数组

<div ng-app="myApp" ng-controller="myCtrl"> 
    <form> 
     <input type="number" ng-model="$ctrl.myNumber" /> 
    </form> 
</div> 

我希望它是有效的,如果输入值是包含在数组中的任意数量(该示例中的阵列possibleInputValues)。

var app = angular.module('myApp', []); 
app.controller('myCtrl', function($scope) { 
    var self = this; 
    self.possibleInputValues = [1, 2, 3, 4, 7, 8, 9, 10]; 
}); 

因此,例如,如果用户键入“2”到输入,它应该是有效的(如在阵列possibleInputValues包含2个),但应为无效例如用于值5

我在AngularJS Documentation中找到的一种方法是为这种验证编写一个自己的指令。这是唯一的方法吗?还是有更轻量的方法来做到这一点?

我所寻找的是这样的事情

<input type="number" ng-model="$ctrl.myNumber" valid-if="$ctrl.isInMyArray()"/> 

和控制器

app.controller('myCtrl', function($scope) { 
    var self = this; 
    self.possibleInputValues = [1, 2, 3, 4, 7, 8, 9, 10]; 
    self.isInMyArray = function(val) { 
     if (self.possibleInputValues.indexOf(val) !== -1) { 
      return true 
     } 
     return false; 
    } 
}); 
+1

看看[角UI的项目(https://angular-ui.github.io/),包括['UI-validate'指令(https://htmlpreview.github.io/? https://github.com/angular-ui/ui-validate/master/demo/index.html)。它可以帮助你很多自定义验证。 –

+0

angular-ui/ui-validate看起来像它正是我正在寻找的。非常感谢! – LocalHorst

+0

很高兴帮助!我会给它一个答案,因为它帮助你。 –

回答

相关问题