Javascript 通过输入条件禁用/启用按钮[AngularJS]

Javascript 通过输入条件禁用/启用按钮[AngularJS],javascript,jquery,angularjs,arrays,Javascript,Jquery,Angularjs,Arrays,我正在用AngularJS开发一个应用程序 一,。我想知道,如果用户键入的输入值不是uib typeahead列表中的项目(在本例中为数组项目),如何禁用按钮?当它是数组的一项时启用它 二,。另外,当用户试图通过已添加的添加按钮添加数组项中的一项时,如何禁用相同的按钮?这些项保存在数组addedItems中 这是HTML中的输入和按钮: <input type="text" ng-model="search1" uib-typeahead="item for item in items

我正在用AngularJS开发一个应用程序

一,。我想知道,如果用户键入的输入值不是uib typeahead列表中的项目(在本例中为数组项目),如何禁用按钮?当它是数组的一项时启用它

二,。另外,当用户试图通过已添加的添加按钮添加数组项中的一项时,如何禁用相同的按钮?这些项保存在数组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>
动作函数在JavaScript中的控制器中定义:

$scope.items = ["admin1", "admin2", "admin3", "admin4", "admin5"];
$scope.search1 = undefined;
$scope.addedItems = [];
$scope.action = function() {
  $scope.addedItems.push($scope.search1);
  }
多谢各位*

我想知道,如果用户键入的输入值不是此列表中uib typeahead列表的项目,如何禁用按钮 数组项的大小写?当它是数组的一项时启用它? 在你的情况下,这将符合你的需要

另外,当用户试图通过已禁用的add按钮添加数组项中的一项时,如何禁用相同的按钮 补充?这些项保存在数组addedItems中。 有两种方法可以做到这一点。 1.在输入中添加一个ng change方法,并在该方法中执行唯一检查。然后将唯一检查结果绑定到按钮中禁用的ng。
2.这将是可重用的,但有点复杂。具有接受列表和输入的自定义唯一检查指令。并让按钮监听错误。类似于ng disabled=form.search1.$unique的东西我不确定是否能完全理解您想要做什么。让我试试

$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>

我希望这对你有帮助

谢谢,这解决了问题2。你知道如何解决问题1吗?1.我想知道,如果用户键入的输入值不是uib typeahead列表中的项目(在本例中为数组项目),如何禁用按钮?当它是数组的一项时启用它?同时,我用一个新方法itemList解决了我的问题2。HTML按钮现在禁用ng=existsaddedItems,search1 | | itemListsearch1,itemsHow ui select可以解决我的问题1吗?问题2已经解决,因为“ui-select”只允许列表中的项目,您不需要禁用该按钮。
<button type="submit" class="btn btn-success" ng-click="action()" 
ng-disabled="exists(addedItems, search1)">Add</button>