通过ng-repeat创建的列表不正确的过滤（AngularJS）

Question

我有一个数组，其中包含区域和数组，每个数组内都有城市。我已经通过BG-重复创建列表：

<div ng-repeat="district in districts | filter:search:startsWith" class="district"> 

     <h4 class="district-name">{{ district.district }}</h4> 
     <a href="{{ district.link }}">Some info</a> 

     <ul class="district-cities"> 

     <li ng-repeat="city in district.cities"> 
      {{ city }} 
     </li> 

     </ul> 


    </div> 

一切正常，当我们点击从哪个区域开始信很好，但是当我们点击了一些信，是不是小区的第一个字母，但同时它在一个城市存在，然后过滤工作不正确。

这里是工作Plnkr。当您尝试单击字母A, B or G时，一切都很好，但是一旦您单击字母Z，就会出现两个不以信件Z开头的地区，但确实包含包含字母Z的城市。

对不起，可能是初级的问题，但如何解决这个问题？

Answer 1

试试这个：

<input id="q" type="text" ng-model="search.district " /> 

和

<ul search-list=".letter" model="search.district"> 
    <li class="letter" ng-repeat="letter in alphabet.letter">{{ letter }}</li> 
</ul> 

这将意味着过滤器只作用于你的对象的小区物业。否则角将看所有的属性。

UPDATE：

你的第二个列表，你会想用search.district作为这样主要的搜索项：

<div ng-repeat="district in districts | filter:search.district:startsWith" class="district"> 

我已经更新了普拉克到包括蓝色的第二个列表是这样搜索的。