使用自定義數據 - *屬性<template>標籤

Question

我建立一個菜單，像這樣的DOM重複模板：

 <template is="dom-repeat" items="{{appletsMenu}}"> 
       <a data-route="{{item.dataRoute}}" href="{{item.href}}"> 
       <iron-icon icon="{{item.icon}}" src="{{item.iconSrc}}" ></iron-icon> 
       <span>{{item.name}}</span> 
       </a> 
     </template> 

在生成DOM的data-route屬性不填充，但：

<a href="...">...</a> 
<a href="...">...</a> 

看起來該模板只呈現「正常」屬性，如href。我錯過了什麼嗎？謝謝。

Answer 1

要綁定到一個屬性，請使用$ =而不是=。這導致調用：

element.setAttribute(attr, value); 

至於反對：

element.property = value; 

(source)

所以你的情況：

<a data-route$="{{item.dataRoute}}" href="{{item.href}}">