0

我发现了一些其他问题,即人们试图将 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。反正我觉得挺聪明的。。

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

JavaScript 控制台中的错误:错误:[$parse:syntax ] http://errors.angularjs.org/1.2.27/$parse/syntax?p0=x.count&p1=is%20unexpected%2C%20expecting%20%5B% 3A%5D&p2=3&p3=%7B%7Bx.count%7D%7DLinks&p4=x.count%7D%7DLinks at Error (native) at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/ angular.min.js:6:450 在 gb.throwError ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:170:252 ) 在 gb.consume ( https ://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:171:181 ) 在 gb.object ( https://ajax.googleapis.com/ajax/libs/angularjs/ 1.2.27/angular.min.js:179:45 ) 在 gb.primary (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:169:385 ) 在 gb.unary ( https://ajax.googleapis.com/ajax/libs/angularjs /1.2.27/angular.min.js:176:73 ) 在 gb.multiplicative ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:175:310 )在 gb.additive ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:175:170 ) 在 gb.relational ( https://ajax.googleapis.com/ ajax/libs/angularjs/1.2.27/angular.min.js:175:34 ) 在 gb.equality ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js :174:400 ) 在 gb.logicalAND ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:174:281) 在 gb.logicalOR ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min.js:174:151 ) 在 gb.ternary ( https://ajax.googleapis.com /ajax/libs/angularjs/1.2.27/angular.min.js:173:461 ) 在 gb.assignment ( https://ajax.googleapis.com/ajax/libs/angularjs/1.2.27/angular.min. js:173:211 )

4

1 回答 1

2

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

<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语法可能会更好。

于 2015-04-23T15:07:39.783 回答