angularjs - 我可以在 ng-repeat 中使用 ng-repeat 并混合插值吗？

Question

我发现了一些其他问题，即人们试图将 ng-repeat 放入 ng-repeat 中，这似乎是可行的。但是为了完成我需要做的事情，我认为我还需要将第一个 ng-repeat 的插值插入到第二个 ng-repeat 中。例如：

前：

<div class="mainDetails">
    <li ng-repeat="x in mainLinks" class="{{x.id}}"><a href="{{x.link}}"><img src = "{{x.icon}}" width = "15px" height = "15px">{{x.name}}</a></li>
</div>
<div class="secondDetails">
    <li ng-repeat="x in secondLinks"><a href="{{x.link}}"><img src = "{{x.icon}}" width = "15px" height = "15px">{{x.name}}</a>
    </li>
</div>
<div class="thirdDetails">
    <li ng-repeat="x in thirdLinks" class="{{x.id}}"><a href="{{x.link}}"><img src = "{{x.icon}}" width = "15px" height = "15px">{{x.name}}</a>
    </li>
</div>

这可能会有点疯狂，尤其是因为我实际上已经达到了“第十八”。

所以这就是我的想法：之后：

<div ng-repeat="x in numOfMaps" class="{{x.count}}Details">
    <li ng-repeat="y in {{x.count}}Links" class="{{y.id}}"><a href="{{y.link}}"><img src="{{y.icon}}" width="15px" height="15px">{{y.name}}</a></li>
</div>

numOfMaps 来自：

$scope.numOfMaps=[{
        count:"main"
    },{
        count:"second"
    },{
        count:"third"
    }];

然后，因为我需要更多“详细信息”，所以我需要做的就是添加计数和繁荣：它也被添加到 HTML。反正我觉得挺聪明的。。

该区域只是空白，不显示任何内容。

score 2 · Accepted Answer

不确定我是否正确地遵循了您的问题，但这是您可以尝试的：

<div ng-repeat="name in ['main', 'first', 'second']" class="{{name}}Details">
    <li ng-repeat="y in this[name + 'Links']" class="{{y.id}}">
        <a href="{{y.link}}">
            <img src="{{y.icon}}" width="15px" height="15px">
            {{y.name}}
        </a>
    </li>
</div>

模板表达式中的关键字this解析为当前范围。但是，此功能是 AFAIK 未记录的。因此，将这些数组作为控制器属性并使用controller as语法可能会更好。

angularjs - 我可以在 ng-repeat 中使用 ng-repeat 并混合插值吗？

1 回答 1

Related

Reference