我正在用 AngularJS 开发一个应用程序。
1. 我想知道如果用户输入的输入值不是 uib-typeahead
列表中的项目(在在这种情况下是数组items
)?当它是数组的一项时启用它?
2. 另外,当用户尝试通过已添加的“添加”按钮添加数组 items
的项目时,如何禁用同一按钮?这些项目保存在数组 addedItems
中。
这是 HTML 中的输入和按钮:
<input type="text" ng-model="search1" uib-typeahead="item for item in items
| filter:$viewValue | limitTo:10"/>
<button type="submit" class="btn btn-success" ng-click="action()"
ng-disabled="(!search1)">Add</button>
这是items
数组结构的示例:
var items = ["admin1", "admin2", "admin3", "admin4", "admin5"];
action()
函数在 JavaScript 的 Controller 中定义:
$scope.items = ["admin1", "admin2", "admin3", "admin4", "admin5"];
$scope.search1 = undefined;
$scope.addedItems = [];
$scope.action = function() {
$scope.addedItems.push($scope.search1);
}
谢谢*
最佳答案
我不确定我是否能完全理解你想要做什么。让我试试。
$scope.items = ["admin1", "admin2", "admin3", "admin4", "admin5"];
$scope.search1 = undefined;
$scope.addedItems = [];
//this method will help you know if the item exists already in the list
$scope.exists = function(list, item){
return list.indexOf(item) > -1;
}
$scope.action = function() {
$scope.addedItems.push($scope.search1);
}
之后您可以使用该方法来启用或禁用按钮,如下所示:
<button type="submit" class="btn btn-success" ng-click="action()"
ng-disabled="exists(addedItems, search1)">Add</button>
希望这对你有帮助!
关于javascript - 通过输入条件禁用/启用按钮 [AngularJS],我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44526901/