Question

我列出了通过ng-repeat显示的国家/地区列表：

<ul>
    <li ng-repeat="country in countries.country | filter:search:startsWith">{{ country }}</li>
</ul>

在此之前，我已经为所有国家/地区创建了一个排序数组：

var countriesNotSorted = ['Ukraine','Urugvai','Russia','Romania','Rome','Argentina','Britain','Indonesia','Germany','Brazil','Portugal','Polska','Uganda','Algeria','Andorra'],
    countriesArray = countriesNotSorted.sort();

此外，我列出了可点击的字母，当其中一个被点击时，列表就会被排序。问题是：是否可以在非常小的情况下将国家列表（通过Angular ng-repeat显示）划分为不同的部分，因此Algeria, Andorra, Argentina和'A'上的所有countires将在某些标题后出现（例如大写字母＆＃39; A＆＃39;）？

A:
Algeria
Argentina
Andorra

B:
Brazil
Bolgaria
Belgium

这是我的Plnkr

Thanx提前注意和时间

Answer 1

您可以简单地ng-repeat覆盖您的字母数组。

<div class="container">

    <input id="q" type="text" ng-model="search " />
    <div ng-repeat="letter in alphabet.letter" ng-show="countriesFiltered.length > 0">
      <h3>{{letter}}</h3>
      <ul>
        <li ng-repeat="country in (countriesFiltered = (countries.country | filter:letter:startsWith | filter:search:startsWith))">{{ country }}</li>
      </ul>
    </div>

</div>

Plnkr

如何划分通过ng-repeat创建的列表的单独部分？

1 个答案: