Polymer 聚合物Topeka中的数据流示例

理解聚合物Topeka示例（）时需要帮助。topeka-app元素中包含了topeka-category元素，它有一个属性&binding{{category}}，但我不明白是什么提供了“category”变量的值。数据必须来自categories.json，我确实在index.html中看到了这个topeka数据源元素，但我似乎无法理解数据如何进入要在topeka category元素中使用的category对象（而不是categories）

Index.html包括：

<topeka-datasource url="bower_components/topeka-elements/categories.json" user="{{user}}" categories="{{categories}}" connected="{{connected}}"></topeka-datasource>

<polymer-element name="topeka-app" attributes="user categories" vertical layout>
 <template>
    <topeka-category id="category" name="category" user="{{user}}" category="{{category}}" allScores="{{allScores}}" wide="{{wide}}"></topeka-category>    // notice a binding called category appears here, although there is no attribute or property of this name in the Polymer script
 </template>
 <script>
   Polymer('topeka-app',{
        categorySelect: function() {
        if (this.category) {          // can't figure out where the code that pulls data from categories.json to put data into this object.
          var n = this.category.name;
          if (n === 'leaderboard') {
            this.showLeaderboard();
          } else if (n === 'profile') {
            this.showProfile();
          } else {
            this.showCategory();
          }
        }
      }
    )
 </script>
</polymer-element>

topeka-app.html包括：

<topeka-datasource url="bower_components/topeka-elements/categories.json" user="{{user}}" categories="{{categories}}" connected="{{connected}}"></topeka-datasource>

<polymer-element name="topeka-app" attributes="user categories" vertical layout>
 <template>
    <topeka-category id="category" name="category" user="{{user}}" category="{{category}}" allScores="{{allScores}}" wide="{{wide}}"></topeka-category>    // notice a binding called category appears here, although there is no attribute or property of this name in the Polymer script
 </template>
 <script>
   Polymer('topeka-app',{
        categorySelect: function() {
        if (this.category) {          // can't figure out where the code that pulls data from categories.json to put data into this object.
          var n = this.category.name;
          if (n === 'leaderboard') {
            this.showLeaderboard();
          } else if (n === 'profile') {
            this.showProfile();
          } else {
            this.showCategory();
          }
        }
      }
    )
 </script>
</polymer-element>

//请注意，此处出现了一个名为category的绑定，尽管Polymer脚本中没有该名称的属性或属性
聚合物（‘topeka-app’{
categorySelect:函数（）{
if（this.category）{//无法找出从categories.json提取数据以将数据放入此对象的代码的位置。
var n=this.category.name；
如果（n==‘排行榜’）{
这个。ShowLeadboard（）；
}else if（n==='profile'）{
这个.showProfile（）；
}否则{
this.showCategory（）；
}
}
}
)

摘自Topeka-category.html

<polymer-element name="topeka-category" attributes="user category selected wide allScores" vertical layout> // This has a "category" attribute, but again I'm not sure where this is coming from.

<script>

Polymer('topeka-category', {

created: function() {
  this.scores = [];
  this.category = {quizzes: []};  // This is all 'this.category' gets when the element is created, but eventually some content of categories.json goes into this object.
.....
})
 </script>
</polymer-element>

//这有一个“category”属性，但我也不确定这是从哪里来的。
聚合物（“topeka-category”{
已创建：函数（）{
这个。分数=[]；
this.category={quizzes:[]}；//这是创建元素时“this.category”得到的全部内容，但categories.json的某些内容最终会进入该对象。
.....
})

查看

编辑：更改了特定git提交的链接，以防Topeka更新为未来版本

topeka数据源正在标记以下javascript所采用的属性

Polymer('topeka-datasource', {
  publish: {
    user: null,
    categories: null,
    url: ''
  },

这基本上只是一种简单的方式来说明聚合物元素具有什么属性

topeka数据源有一个子元素

<core-ajax auto handleAs="json" url="{{url}}" response="{{categories}}"></core-ajax>

---

this.category绑定到{{category}}表达式。

谢谢。这很有意义。