AngularJS entrée valide si la valeur est dans le tableau

Question

ayant une entrée

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

Je veux qu'il soit valide, si la valeur d'entrée est un nombre contenu dans un tableau (dans cet exemple le tableau possibleInputValues).

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

Ainsi, par exemple, si l'utilisateur tape « 2 » dans l'entrée, il devrait être valide (comme le tableau possibleInputValues contient 2), mais devrait être invalide par exemple, pour la valeur 5.

Une façon que j'ai trouvé dans le AngularJS Documentation est d'écrire une propre directive pour ce genre de validation. Est-ce le seul moyen ou existe-t-il un moyen plus léger de le faire?

Ce que je cherche est quelque chose comme ça

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

et le contrôleur

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; 
    } 
}); 

Answer 1

Vérifier Angular-UI's project qui comprend ui-validate/ui-validate-async directives.

Cette directive facilite la création d'expressions de validateur personnalisées. Dans votre cas, il peut ressembler à ui-validate="{inArray: 'isInMyArray($value)' }".