angular 2 使 mdl-badge data-badge 内容动态化

Question

我正在使用 angular 2 material 设计，我想将数据绑定到 mdl-badge，但这样做时出现错误。

html代码

 <div class="material-icons mdl-badge mdl-badge--overlap" data-badge={{numFlags}}>num Of flags</div>

ts 组件

   this.numFlags=msg++;

Answer 1

该语法无效。你必须使用

[attr.data-badge]="numFlags"

或

attr.data-badge={{numFlags}}

以便将 numFlags 绑定到 data-badge。

plnkr