聚合物1.0元素屬性對象綁定，維護結構

Question

我想創建一個將JSON對象作爲輸入的自定義元素。

<activity-tracker activity='{"title": "Lord Meowser", "description": "lala"}'></activity-tracker> 

元素本身看起來像這樣

<dom-module id="activity-tracker"> 
    <style> 
    :host { 
     display: block; 
     box-sizing: border-box; 
    } 
    </style> 

    <template> 
    <p>{{activity}}</p> 
    <p>{{activity.title}}</p> 
    </template> 

</dom-module> 

和物業結合

properties: { 
    activity: { 
    title: { 
     type:String, 
     value: '...' 
    }, 
    description:{ 
     type:String, 
     value: '...' 
    } 
    } 
}, 

<p>{{activity}}</p>結果{ 「稱號」： 「主Meowser」， 「說明」：「拉拉「}

<p>{{activity.title}}</p>爲空

如何映射它？我應該如何處理，如果用戶插入其他東西，可以說活動=「notanobject」。目前，定義的內部對象被覆蓋，並顯示字符串。

Answer 1

<dom-module id="activity-tracker"> 
    <style> 
    :host { 
     display: block; 
     box-sizing: border-box; 
    } 
    </style> 

    <template> 
    <p>{{variable}}</p><!-- this shows [object Object]--> 
    <p>{{variable.title}}</p> <!-- this shows Lord Meowser--> 
    <p>{{variable.description}}</p> <!-- this shows lalala--> 
    </template> 

    <script> 
     Polymer({ 
     is:"activity-tracker", 
     properties:{ 
      variable:{ 
      type:Object, 
      value: function(){return {};} 
      } 
     } 

     }); 
    </script> 

</dom-module> 

<activity-tracker variable='{"title": "Lord Meowser", "description": "lala"}'></activity-tracker> 

這應該有效。