Question

输入重复值时需要限制。有一个添加按钮，用户点击，然后出现一个文本字段。用户输入数据。 AngularJS检查数据是否重复。如果不是，则创建新的文本字段。这是战略。

最初，val = undefined。当推送时，数组获取值。但我想知道如何执行indexOf或任何其他AngularJS方法，以维持重复。

HTML

<input type="button" ng-click="add(set.values[$index])" value="add">
<span ng-show="message"> Please enter a new value </span> 

<table>
    <tr>
        <th> New valid values </th>
    </tr>
    <tr ng-repeat="val in set.values track by $index">
        <td><input type="text" ng-model="set.values[$index]"></td>
    </tr>
</table>


$scope.set = { values: [] };//array that contains previous ng-model values

$scope.add = function(val) {
  var index = $scope.set.values.indexOf(val);attempt 1
  var index = $scope.set.values.includes(val);attempt 2
  var index = $scope.set.values.indexOf($scope.set.values) 2
  var index = $scope.set.values.includes($scope.set.values) 3
  var index = $scope.set.values.includes($scope.set.values[]) 4

  if (index == false) {
    $scope.message = false;
    $scope.set.values.push('');
  }
  else {
    $scope.message = true;
  }
};

Answer 1

使用angular $ filter可以从值数组或对象中提取给定值。然后你可以简单地检查过滤器是否返回了任何元素。

$scope.add = function(val) {    
  return $filter('filter')($scope.set.values, val, true).length;
}

记得在你的角度模块中注入$ filter。

Answer 2

您可以检查数组中是否存在最后输入的值

<强> HTML ：

<input type="button" ng-click="add()" value="add"> <span ng-show="message"> Please enter a new value </span>
<table>
    <tr>
        <th> New valid values </th>
    </tr>
    <tr ng-repeat="val in set.values track by $index">
        <td>
            <input type="text" ng-model="set.values[$index]"> </td>
    </tr>
</table>

<强> JS ：

$scope.set = {
    values: [" "] //array that contains previous ng-model values & initialize it to empty string
};
$scope.add = function() {
    var length = $scope.set.values.length - 1;
        $scope.newArray=$scope.set.values.slice(-1);//array without last element
        var index = $scope.newArray.indexOf($scope.set.values[length]);
        if (index == -1) {
            $scope.message = false;
            $scope.set.values.push('');
        } else {
            $scope.message = true;
        }
};

限制重复值AngularJS推送方法

2 个答案: