使用HTML定义的过滤器，在我的角度控制器

我使用一个文本框，其中用户可以输入任何文字。基础上，在下面显示的列表中的项目，只要文本键入/删除过滤...使用HTML定义的过滤器，在我的角度控制器

选择所有（送大家有）从mainlist删除的项目，并添加这些元素选择列表...

的一切工作正常。我想，只有那些过滤应该被移动从一个列表到另一个信息...（全部选择，所有的项目都转移！）

我可以通过相同的文本（由用户输入），并把它作为一个过滤器在我的名单里面的角度控制器？

如果是的话，指导我如何。下面

是代码段：

$scope.transferList = function (x) { 
 
\t \t if (x === "selectAllServers") { 
 
\t \t \t for (i = 0; i < $scope.lists.serversList.servers.length; i++) { 
 
\t \t \t \t $scope.lists.selectedServersList.servers.push( $scope.lists.serversList.servers[ i ]); 
 
\t \t \t } 
 
\t \t \t $scope.lists.serversList.servers = []; 
 
      } 
 
    };

<div class="text-center"> 
 
\t \t <h3>Select Servers</h3> 
 
\t </div> 
 
\t <div class="container col-md-4 col-md-offset-1"> 
 
\t \t <form> 
 
\t \t <div class="form-group"> 
 
     \t \t \t <div class="input-group style='width: 100%'"> 
 
     \t \t \t <div class="input-group-addon"><i class="glyphicon glyphicon-filter"></i></div> 
 
     \t \t \t <input type="text" class="form-control" placeholder="Enter text to filter servers..." ng-model="searchTerm"> 
 
     \t \t \t </div>  
 
    \t \t </div> 
 
\t \t </form> 
 
\t </div> 
 
\t <div class="row"> 
 
\t \t <div class="box col-md-4 col-md-offset-1"> 
 
\t \t \t <ul dnd-list="lists.serversList.servers" 
 
\t \t \t \t dnd-allowed-types="lists.serversList.allowedTypes"> 
 
\t \t \t \t <li class="text-center">Servers Available</li> 
 
\t \t \t \t <li ng-repeat="server in lists.serversList.servers|filter:searchTerm" 
 
\t \t \t \t \t dnd-draggable="server" dnd-type="server.type" 
 
\t \t \t \t \t dnd-disable-if="server.type == 'unknown'" 
 
\t \t \t \t \t dnd-moved="lists.serversList.servers.splice($index, 1)" 
 
\t \t \t \t \t dnd-effect-allowed="move" class="background-unselected" 
 
\t \t \t \t \t class="searchable"> 
 
\t \t \t \t \t <div class="handle"> 
 
\t \t \t \t \t \t <i class="glyphicon glyphicon-chevron-right" 
 
\t \t \t \t \t \t \t ng-click="selectItem('server',$index)"></i> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t \t <div class="name">{{server.name}}</div> 
 
\t \t \t \t </li> 
 
\t \t \t \t <li class="dndPlaceholder">Drop <strong>server</strong> here 
 
\t \t \t \t </li> 
 
\t \t \t </ul> 
 
\t \t </div> 
 
\t \t <div class="box col-md-4 col-md-offset-2"> 
 
\t \t \t <ul dnd-list="lists.selectedServersList.servers" 
 
\t \t \t \t dnd-allowed-types="lists.selectedServersList.allowedTypes"> 
 
\t \t \t \t <li class="text-center">Servers Selected</li> 
 
\t \t \t \t <li ng-repeat="server in lists.selectedServersList.servers" 
 
\t \t \t \t \t dnd-draggable="server" dnd-type="server.type" 
 
\t \t \t \t \t dnd-disable-if="server.type == 'unknown'" 
 
\t \t \t \t \t dnd-moved="lists.selectedServersList.servers.splice($index, 1)" 
 
\t \t \t \t \t dnd-effect-allowed="move" class="background-selected"> 
 
\t \t \t \t \t <div class="handle"> 
 
\t \t \t \t \t \t <i class="glyphicon glyphicon-chevron-left" 
 
\t \t \t \t \t \t \t ng-click="removeItem('server',$index)"></i> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t \t <div class="name">{{server.name}}</div> 
 
\t \t \t \t </li> 
 
\t \t \t \t <li class="dndPlaceholder">Drop <strong>server</strong> here 
 
\t \t \t \t </li> 
 
\t \t \t </ul> 
 
\t \t </div> 
 
\t </div> 
 
\t <br /> 
 
\t <div class="row"> 
 
\t \t <div class="col-md-4 col-md-offset-1"> 
 
\t \t \t <button class="btn btn-default btn-block" 
 
\t \t \t \t ng-click="transferList('selectAllServers')"> 
 
\t \t \t \t Send Everyone there <i class="glyphicon glyphicon-arrow-right"></i> 
 
\t \t \t </button> 
 
\t \t </div> 
 
\t \t <div class="col-md-4 col-md-offset-2"> 
 
\t \t \t <button class="btn btn-default btn-block" 
 
\t \t \t \t ng-click="transferList('unSelectAllServers')"> 
 
\t \t \t \t <i class="glyphicon glyphicon-arrow-left"></i> Send Everyone there 
 
\t \t \t </button> 
 
\t \t </div> 
 
\t </div>

希望的代码是足够可读。

来源

2015-11-10 Sachin Sharma

1.You可以启动相同的过滤器：

$scope.add = function() { 
    var filtered = $filter('filter')($scope.lists.serversList.servers, $scope.searchTerm); 
    // actual add here 
}

你看这里2.As有一些代码的重复 - 您使用相同的过滤器的两倍，因此你可以重写一下：

<input type="text" class="form-control" placeholder="Enter text to filter servers..." ng-model="searchTerm" ng-change="recalculateFiltered()"> 
<li ng-repeat="server in filteredList" ...

而在控制器：

$scope.recalculateFiltered = function() { 
     $scope.filteredList = $filter('filter')($scope.lists.serversList.servers, $scope.searchTerm); 
}

来源

2015-11-10 11:44:43

谢谢....我正在尝试这个。还可以我用这个过滤器（SEARCHTERM）太检索所有除了那些符合筛选条件？ –

['name1'，'name2'，'qwe'] |过滤器：'！name' - > ['qwe'] –

使用HTML定义的过滤器，在我的角度控制器

回答

相关问题