爲什麼我不能通過數據綁定分配元素的類？

Question

我正在創建一個自定義元素，代表一塊聯繫媒體放到我的個人網站上。該元件的工作示例如下：

的想法是，我可以在標題，值傳遞，和字體真棒圖標類的字符串。

事情是，Font Awesome Icon類實際上是3個類。上面的圖標是「fa fa-globe fa-2x」。我只想傳遞圖標類名稱的「globe」部分。這是該元素的原代碼，減去風格，其目的是實現這一點：

<template> 
    <i class="{{fa_icon}}"></i> 
    <div class="line"></div> 
    <span class="title">{{title}}</span> 
    <div class="line"></div> 
    <span class="value">{{value}}</span>  
</template> 
<script> 
    Polymer({ 
     is: 'contact-tile', 
     properties: { 
      title: String, 
      value: String, 
      icon: String, 
      fa_icon: { 
       type: String, 
       computed: 'generateIconClass(icon)' 
      } 
     }, 
     generateIconClass: function (icon) { 
      return 'fa fa-' + icon + ' fa-2x'; 
     }, 
    }); 
</script> 

但是，使用上面的代碼和類不會被添加到該對象時該圖標顯示不出來。

如果我在ready回調中添加我自己的類，通過下面的代碼，一切正常。

<template> 
    <i id="i"></i> 
    <div class="line"></div> 
    <span class="title">{{title}}</span> 
    <div class="line"></div> 
    <span class="value">{{value}}</span>  
</template> 
<script> 
    Polymer({ 
     is: 'contact-tile', 
     properties: { 
      title: String, 
      value: String, 
      icon: String, 
      fa_icon: { 
       type: String, 
       computed: 'generateIconClass(icon)' 
      } 
     }, 
     generateIconClass: function (icon) { 
      return 'fa fa-' + icon + ' fa-2x'; 
     }, 
     ready: function() { 
      this.$.i.className += ' ' + this.fa_icon; 
     } 
    }); 
</script> 

我應該期待這種行爲嗎？如果是這樣，爲什麼？

Answer 1

使用class$="{{fa_icon}}"。當綁定到像類這樣的本地屬性時，語法要求您使用$ =（docs）。