如何使用 Angular 编写数据属性? [英] How can I write data attributes using Angular?

问题描述

我觉得我错过了一些东西.当我尝试在我的 template 中使用 data attribute 时，如下所示:

<li *ngFor="#section of Sections";data-sectionvalue={{section.value }}">{{ section.text }}</ol>

Angular 2 崩溃:

<块引用>

例外:模板解析错误:无法绑定到sectionvalue"，因为它不是已知的本地属性(

]data-sectionvalue="{{ section.value }}">{{ section.text }}

我显然在语法上遗漏了一些东西，请帮忙.

解决方案

改用属性绑定语法

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

或

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

另见:

• 如何在 Angular 2 中添加条件属性?

I feel like I am missing something. When I try to use a data attribute in my template, like this:

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

Angular 2 crashes with:

EXCEPTION: Template parse errors: Can't bind to 'sectionvalue' since it isn't a known native property ("

]data-sectionvalue="{{ section.value }}">{{ section.text }}

I'm obviously missing something with the syntax, please help.

解决方案

Use attribute binding syntax instead

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

or

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

See also :

• How to add conditional attribute in Angular 2?

这篇关于如何使用 Angular 编写数据属性?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！