Javascript Ng显示和筛选

我希望能够显示一个完整的城市列表时，页面第一次加载

当用户单击该城市的复选框时，我希望使用ng show/ng hide显示用户选择的城市的结果，并隐藏未选择的城市

我不想使用过滤器，因为此添加/删除操作会导致dom重新渲染

---

有人知道最好的方法吗

我猜你在用

ng repeat

显示所有城市？如果是，您可以这样做：

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

{{city}
{{selectedCity}

一旦用户选择一个城市，您的变量

selectedCity

将填充，它将隐藏列表并显示

li

，而

selectedCity

仅显示

当用户单击复选框时，必须在控制器中设置变量

selectedCity

你没有发布任何代码，所以我不知道你的实现到底是为了展示城市。我希望这个例子是清楚的

---

查看此项以查看这是否是您正在寻找的功能。

例如，如果您在$scope.cities中保留城市，并且您在登录页上重复城市，请在cities ng repeat中使用类似的复选框

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

使用对象表达式将筛选器设置为ng repeat指令

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

试试看：

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

伦敦
洛杉矶

ng show=“city==selectedcity”

在所有复选框中，她是一个小提琴手。在选择伦敦时，我想隐藏洛杉矶，反之亦然。

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