2015-03-29 3 views
20

На данный момент существует ли способ получить текущий индекс итерации в директиве for..of в Angular 2? В других словах, эквивалент $index в Angular.js v1 ...Получить индекс в ... директиве в Angular 2

Пример кода:

<ul *for="#task of allTasks"> 
    <li>{{ $index}} - {{ task.label }}</li> 
</ul> 

(конечно, этот код не работает, он не обеспечивает текущий индекс)

ответ

41
<ul> 
    <template ngFor let-task [ngForOf]="allTasks" let-i="index"> 
     <li>{{ i }} - {{ task.label }}</li> 
    </template> 
</ul> 

Но вы должны использовать очень самую последнюю версию из QuickStart

BTW - выше, является эквивалентом следующего синтаксиса сахара

<li *ngFor="let task of allTasks; let i=index">{{ i }} - {{ task.label }}</li> 
+0

На самом деле, это делает работу в QuickStart до тех пор, как вы обновили до последней версии быстрого старта – unobf

+0

Спасибо. Первая версия возвращает ошибку (я не обновлял быстрый запуск, на данный момент я не хочу влиять на остальную часть моего кода), но второй синтаксис работает хорошо. Благодаря ! – romaintaz

13

Синтаксис был обновлен и теперь (по состоянию на Angular2.beta13, апрель 2016):

<li *ngFor="let item of items; let i = index"></li> 

Например:

<li *ngFor="let item of items; let i = index"> 
    item={{item}} index={{i}} 
</li> 
0

обновление, используйте пусть не №

3

Используйте * ngFor, пусть:

<li *ngFor="let menu of tempMenuModel.MenuItems.Items;let i=index" [ngClass]="{'active' : clickedItem == i}" (click)="SelectMenu(menu,i)"> 
     <span>{{menu.Header ==null?menu.Name:menu.Header}}</span> 
</li> 

Компонент:

SelectMenu(menu, $index) {  
    this.clickedItem = $index;   
} 
Смежные вопросы