Ng显示和过滤器

Question

我希望能够在首次加载页面时显示城市的完整列表。

当用户点击该城市我想用NG-显示/ NG隐藏以显示用户所选城市的结果，并隐藏非选定城市的复选框。

我不想使用过滤器，因为这从加DOM /删除使其重新渲染。

有谁知道最好的方法来做到这一点。

Answer 1

我猜你使用ng-repeat来显示所有的城市？如果是的话，你可以做这样的事情：

<ul class="cities"> 
    <li ng-repeat="city in cities" ng-show="!selectedCity">{{city}}</li> 
    <li ng-show="selectedCity">{{selectedCity}}</li> 
</ul> 

一旦用户选择一个城市，你的变量selectedCity将填充，它会隐藏列表和显示li与selectedCity只显示。

你必须设置在控制器变量selectedCity当用户点击复选框。

你没有张贴任何代码，所以我不知道究竟是您的实现，以显示城市。我希望这个例子很清楚。

看到这个fiddle，看看这是你正在寻找的功能。

Answer 2

例如如果u持有$ scope.cities城市和你重复的着陆页使用复选框，这样的城市在城市纳克重复

<input type="checkbox" ng-model="$scope.cities[$index]['select']" ng-true-value="'YES'" ng-false-value="NO" ng-click="showCitiesData(city)"> 

然后在你的控制器

.controller{ 
$scope.showcitydata=false; 
$scope.showCities=function(city){ 
if(city.select=='YES;){ 
    $scope.showcitydata=true; 
    } 
} 
} 

Answer 3

设置过滤成ng-repeat指令与对象表达式

ng-repeat="city in cities | filter:{selected:true}" 

Answer 4

尝试：

<label ng-init="city = {}"><input type="checkbox" ng-change="selected = true" ng-model="city['London']">London</label> 
<label><input type="checkbox" ng-change="selected = true" ng-model="city['Los Angeles']">Los Angeles</label> 

<div ng-controller="MyCtrl"> 
    <ul class="employees"> 
     <li ng-repeat="employee in employees" ng-show="!selected || city[employee.city]"> 
     {{employee.name}} 
     </li> 
    </ul> 
</div>