重复值的限制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;
}
};
使用角$过滤器,可以从值或对象的数组提取一个给定值。 然后你可以简单地检查过滤器是否返回任何元素。
$scope.add = function(val) {
return $filter('filter')($scope.set.values, val, true).length;
}
记得在角度模块内注入$ filter。
谢谢我会放弃一下。 –
它不会修改$ 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;
}
};
谢谢,我会放弃这一切。 –
当我输入第二个值时,$ 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
你想,未来textfield是在用户打字的时候出现,还是在他完成打字之后再次点击同一个按钮? – MrWook
'ng-click =“add(set.values [$ index])”' - 你不会得到正确的'$ index'值 –
@MrWook,我想要他完成打字并点击按钮 –