Угловые 2 атрибуты данных


Я чувствую, что мне чего-то не хватает. Когда я пытаюсь использовать dataattribute в своем template, например:

<ol class="viewer-nav">
    <li *ngFor="#section of sections" data-value="{{ section.value }}">
        {{ section.text }}
    </li>
</ol>

Angular 2 падает с:

исключение: ошибки синтаксического анализа шаблона: не удается привязать к 'sectionvalue' с тех пор это не известное собственное свойство ("

]data-sectionvalue= " {{ section.значение }} " > {{ раздел.текст }}

Я, очевидно, что-то не хватает с синтаксисом, пожалуйста, помогите.

2 147

2 ответа:

вместо этого используйте синтаксис привязки атрибутов

<ol class="viewer-nav"><li *ngFor="let section of sections" 
    [attr.data-sectionvalue]="section.value">{{ section.text }}</li>  
</ol>

или

<ol class="viewer-nav"><li *ngFor="let section of sections" 
    attr.data-sectionvalue="{{section.value}}">{{ section.text }}</li>  
</ol>

см. также как добавить условный атрибут в угловой 2?

доступ

<ol class="viewer-nav">
    <li *ngFor="let section of sections" 
        [attr.data-sectionvalue]="section.value"
        (click)="get_data($event)">
        {{ section.text }}
    </li>  
</ol>

и

get_data(event) {
   console.log(event.target.dataset.sectionvalue)
}