Angularjs 根据单击的复选框,使用变量名调用函数

Angularjs 根据单击的复选框,使用变量名调用函数,angularjs,data-binding,angularjs-bindings,Angularjs,Data Binding,Angularjs Bindings,我想做的是做一个搜索函数。我希望通过使用复选框并根据每个复选框的值来调用控制器中的函数,从而拥有多个选项。详细地说,到目前为止,我所做的是一个下拉菜单: <input type="text" placeholder="Search Keyword..." ng-model="searchKeyword"> <select ng-model="selectedProperty"> <option value="usersUsername">Users:

我想做的是做一个搜索函数。我希望通过使用复选框并根据每个复选框的值来调用控制器中的函数,从而拥有多个选项。详细地说,到目前为止,我所做的是一个下拉菜单:

<input type="text" placeholder="Search Keyword..." ng-model="searchKeyword">
<select ng-model="selectedProperty">
    <option value="usersUsername">Users: Username</option>
    <option value="accountsName">Accounts: Name</option>
</select>
<button type="submit" ng-click="search()">Search</button>

因此,我现在尝试的是将下拉菜单更改为多个选中的复选框,例如,如果选择了用户用户名和帐户名来调用控制器searchByUsersUsernameAccountsName($scope.searchKeyword)中的函数.

您可以通过控制器范围内的对象数组显示复选框,属性绑定到复选框值。在搜索函数中,您可以检查绑定到复选框的每个对象的属性值

下面是我想到的代码示例

内部控制器

$scope.checkboxes = [ 
{ checked: false, value: "Username", url_key: "searchAccountsName" },
{ checked: false, value: "Accounts Name", url_key: "searchUsersU‌​sername" } ];
$scope.search = function () {
  var urlParams = "";
 for (var i = 0; i < $scope.checkboxes.length; i++){
   if( $scope.checkboxes[i].checked ){
      urlParams = urlParams + $scope.checkboxes[i].url_key + '=true&'
   }
 }

 var urlParams = urlParams + "searchK‌​eyword="+ $scope.searchKeyword;
 searchFn(urlParams);
}
现在在HTML文件中,通过ng repeat呈现这些复选框

<div class="ui fluid action large input">
   <input type="text" placeholder="Search Keyword..." ng-model="searchKeyword">
   <div class="checkboxes">
      <div ng-repeat="checkbox in checkboxes">
          <input type="checkbox" ng-model="checkbox.checked"/> {{checkbox.value}}
      </div>
   </div>
</div>

{{checkbox.value}
现在在控制器中的搜索功能中

$scope.checkboxes = [ 
{ checked: false, value: "Username", url_key: "searchAccountsName" },
{ checked: false, value: "Accounts Name", url_key: "searchUsersU‌​sername" } ];
$scope.search = function () {
  var urlParams = "";
 for (var i = 0; i < $scope.checkboxes.length; i++){
   if( $scope.checkboxes[i].checked ){
      urlParams = urlParams + $scope.checkboxes[i].url_key + '=true&'
   }
 }

 var urlParams = urlParams + "searchK‌​eyword="+ $scope.searchKeyword;
 searchFn(urlParams);
}
$scope.search=函数(){
var urlParams=“”;
对于(变量i=0;i<$scope.checkbox.length;i++){
if($scope.checkbox[i].选中){
urlParams=urlParams+$scope。复选框[i]。url_key+'=true&'
}
}
var urlParams=urlParams+“searchK‌​eyword=“+$scope.searchKeyword;
searchFn(urlparms);
}

searchFn
中,您只需将此
urlParams
字符串附加在url中的问号之后。

感谢您的回复。我上面提到的就是一个例子。我不会有特定数量的复选框。假设我们有3个、4个或更多的复选框,我将如何检查4个复选框中的2个是否只被单击?嗯,这是一个有趣的场景。你认为可以根据每个复选框的“checked”值调用多个函数吗?我认为可以这样做,但我不知道它是否适合我的情况。我之所以这样做,是因为我有一个带有搜索功能的服务,并且我必须进行GET调用的特定uri类似于:/path to service/search?searchAccountsName=true&searchUsersUsername=true&searchKeyword=test,所以我想“标记”用户正在检查哪些选项以便将其传递给用户请检查我的答案中的编辑。我希望它能满足你的要求。