重複值的限制AngularJS推送方法

需要限制輸入重複值。有一個添加按鈕，用戶點擊，然後出現一個文本字段。用戶輸入數據。 AngularJS檢查數據是否重複。如果不是，則創建一個新的文本字段。這是策略。重複值的限制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; 
    } 
};

來源

2017-08-30 John Smith

你想，未來textfield是在用戶打字的時候出現，還是在他完成打字之後再次點擊同一個按鈕？ – MrWook

'ng-click =「add（set.values [$ index]）」' - 你不會得到正確的'$ index'值 –

@MrWook，我想要他完成打字並點擊按鈕 –

使用角$過濾器，可以從值或對象的數組提取一個給定值。然後你可以簡單地檢查過濾器是否返回任何元素。

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

記得在角度模塊內注入$ filter。

來源

2017-08-30 11:10:20

謝謝我會放棄一下。 –

它不會修改$ filter。 –

您是否在使用前在您的控制器/指令/服務中注入了$ filter？ –

您可以檢查，如果最後輸入的數值數組中存在的或不

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

來源

2017-08-30 11:18:14 Vivz

謝謝，我會放棄這一切。 –

當我輸入第二個值時，$ scope.set.values.indexOf（$ scope.set.values [length]）等於1，因此它的$ scope.message = false。因此即使在第二個字段與第一個字段不同時也不能被處理。 –

如果$ scope.set.values.indexOf（$ scope.set.values [length]）等於1，那麼$ scope.message = true; 。嘗試用上面的答案 – Vivz

重複值的限制AngularJS推送方法

回答

相關問題