Angular2 *ngFor установка индекса как атрибута внутри того же тега

Я пытаюсь создать загрузочную карусель. Поэтому я использую *ngFor для добавления элементов и индикаторов карусели (маленькие кружки, указывающие текущую позицию).

<li data-target="#myCarousel" *ngFor="#item of items; #idx = index"  data-slide-to="idx" [class.active]="idx === 0" >

Я устанавливаю запись активного класса с помощью [class.active]="idx ​​=== 0", и она отлично работает. Но когда я пытаюсь установить data-slide-to="idx", результатом является не желаемый индекс как число, а строка "idx".

Любая идея, как присвоить значение индекса?


angular indexing ngfor
person PaxVobisCum    schedule 10.06.2016    source источник

Ответы (2)


arrow_upward
5
arrow_downward

Здесь у вас есть два варианта:

<сильный>1. Привязать напрямую к атрибуту

[attr.data-slide-to]="idx"

<сильный>2. Использовать интерполяцию строк

attr.data-slide-to="{{idx}}"
person rinukkusu    schedule 10.06.2016

arrow_upward
0
arrow_downward

Для привязки требуется [] или {{}}. Привязка к атрибутам требует префикса attr.

[attr.data-slide-to]="idx"
person Günter Zöchbauer    schedule 10.06.2016