Angularjs嵌套ng重复,在筛选器中使用表达式

Angularjs Nested ng-repeat with expression used in filter

本文关键字:表达式 筛选 嵌套 ng 重复 Angularjs      更新时间:2023-09-26

我正在尝试使用嵌套ng重复中过滤器中第一个ng重复的值。

特别是CCD_ 1。这在第一次重复时表现良好,注意过滤器和h3标记。

然而,表达式在第二个重复中呈现为文本,同样不是过滤器,因此重复为空,因为它不匹配。我觉得我错过了一些非常明显的东西。有什么想法吗?感谢

<div ng-repeat="alpha in alphabet" ng-hide="(tlds | filter: {group: '.{{alpha.value}}'}).length<1" ng-cloak="cloak">
    <h3>{{alpha.value}}</h3>
    <ul class="list-group">
        <li class="list-group-item" ng-repeat="tld in tlds | filter: {group: '.{{alpha.value}}'} | filter: {name: query} | orderBy: 'name'" ng-cloak="cloak">
            <a href="/downloads/pdftld/{{tld.pdf}}" target="_blank">{{tld.name}}</a>
        </li>
    </ul>
</div>

JS Fiddle with it breakedhttp://jsfiddle.net/eminentstyle/v5g4u948/2/

如果我手动插入预期的表达式结果,第20行过滤器:{group: '.c'},您可以看到第一部分的预期结果http://jsfiddle.net/eminentstyle/kwmj5mtu/2/

我想你想要这个:http://jsfiddle.net/v5g4u948/3/

<div class="container" ng-app="Tlds">
    <div class="page-header">
         <h1>Tlds</h1>
    </div>
    <div class="row">
        <div class="col-sm-12">
            <input type='search' class='form-control' placeholder='Search' ng-model='query' />
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12" ng-controller="TldsCtrl">
            <div ng-repeat="alpha in alphabet" ng-hide="(tlds | filter: {group: '{{alpha.value}}'} | filter: {name: query}).length<1" ng-cloak="cloak">
                 <h3>{{alpha.value}}</h3>
                <ul class="list-group">
                    <li class="list-group-item" ng-repeat="tld in tlds | filter: {group: alpha.value} | filter: {name: query} | orderBy: 'name'" ng-cloak="cloak"> <a href="/downloads/pdftld/{{tld.pdf}}" target="_blank">{{tld.name}}</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>

小心filter: {group: '.{{alpha.value}}'意味着过滤包含字母值的所有组。例如。'ie与e匹配。