在ng-repeat中获取ng-repeat的索引

get index of ng-repeat inside of ng-repeat

本文关键字:ng-repeat 索引 获取      更新时间:2023-09-26

我有一个页面,其中数组内部有一个数组,并使用ng-repeat 2次显示。

<div ng-repeat="chapter in chapters">
        <div ng-repeat="page in chapter.pages">
            <p>Title: {{page.title}}</p>
        </div>
    </div>

数组是:

$scope.chapters= [
    {
        pages: [
            {title: 'Title3'},
            {title: 'Title4'},
            {title: 'Title5'}
        ]
    },
    {
        pages: [
            {title: 'Title1'},
            {title: 'Title2'}
        ]
    }
];

我需要访问'p'元素内的章节和页面的$index,即我想访问章节编号和页面编号。

我怎样才能做到这一点?

这里的关键是每个ng-repeat指令中提供的$index变量。请注意,索引从0开始,这就是为什么我在显示章节和页面时添加了+ 1

<div ng-repeat="chapter in chapters" ng-init="chapterNumber = $index">
    <div ng-repeat="page in chapter.pages">
        <p>Chapter: {{chapterNumber + 1}}, Page: {{$index + 1}}, Title: {{page.title}}</p>
    </div>
</div>

JSFiddle

对于章节使用{{$index}}对于页面可以使用{{$parent.$index}}访问索引
请看这里:http://jsbin.com/xowub/2/

 <div ng-repeat="chapter in chapters">
            <div ng-repeat="page in chapter.pages">
                <p>Page: {{$parent.$index}}  chapter:{{$index}} Title: {{page.title}}</p>
            </d
          </div>