Question

我想同时对两个不同的项目使用ng-repeat。我的意思是， ng-repeat =＆＃34; mylist1在list1＆amp;＆amp; list2＆＃34;

中的mylist2

我需要对list1和list2使用repeat。

如何将ng-repeat用于多个项目？

Answer 1

我认为你最好创建一个组合列表。例如（在您的控制器中）

$scope.lists = list1.map(function(item, i) {
    return {
        item1: item,
        item2: list2[i] || null
    };
});

然后你可以迭代这个

<div ng-repeat="item in lists">
    <p>list1 item: {{ item.item1 }}</p>
    <p>list2 item: {{ item.item2 }}</p>
</div>

或者，您可以使用$index来引用list2中的相应项。

<div ng-repeat="item1 in list1" ng-init="item2 = list2[$index]">

Answer 2

使用控制器中的函数来连接它们：

$scope.mergeLists = function (arr1, arr2) {
     return arr1.concat(arr2);
}

然后你有：

<div ng-repeat="mylist1 in mergeLists(list1, list2)">

Fiddle

Answer 3

我假设您有两个列表如下：

mylist1=[1,2,3,4,5]
mylist2=[6,7,8,9,0]

并且您希望迭代它们，以便生成的元素是

[[1,6,], [2,7], [3,8], [4,9], [5,0]]

我建议你看一下lodash.js（或underscore.js）中的zip - 一个很棒的功能库，帮助你梳理并保留所有头发。

Example:
_.zip(['fred', 'barney'], [30, 40], [true, false]);
// → [['fred', 30, true], ['barney', 40, false]]

在这种情况下：

mergedLists = _.zip(mylist1, mylist2)
ng-repeat="item in mergedLists"

在您的应用程序js文件中，您可以分配压缩两个列表的结果，然后使用ng-repeat来迭代列表中的值。请注意，列表中的每个项目也是一个列表。

Answer 4

您可以利用id

<ListView Name="listMenuItems" SelectionMode="Multiple" Background="Transparent" SelectionChanged="listMenuItems_SelectionChanged">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Border  Width="700" Height="80" CornerRadius="5" BorderBrush="Gray" BorderThickness="2">
                <Border.BitmapEffect>
                    <DropShadowBitmapEffect Color="Red" Direction="200" Noise=".6" ShadowDepth="10" Opacity=".6"/>
                </Border.BitmapEffect>
                <TextBlock Name="txtItem"  Height="100" Width="650" FontSize="50" Text="{Binding Path=item}"  FontFamily="Georgia"></TextBlock>
            </Border>
        </DataTemplate>    
    </ListView.ItemTemplate>      
</ListView>

现在你可以使用lst2

了

AngularJS多次重复

4 个答案: