Javascript polymer core ajax是否重用绑定?

Javascript polymer core ajax是否重用绑定?,javascript,ajax,polymer,Javascript,Ajax,Polymer,我创造了两种聚合物元素: 闪光图 节点列表 我的目标是呈现一个由RESTAPI中的数据备份的迷你图列表 现在我遇到了一个问题,在节点上的每次迭代中,所有的迷你图值都设置为实际迭代的值。但是这只发生在历史绑定中,而不是节点.id绑定中 我有没有漏掉一点 节点列表 <polymer-element name="node-list"> <template> <core-ajax auto url="http://demonstrator

我创造了两种聚合物元素:

  • 闪光图
  • 节点列表
  • 我的目标是呈现一个由RESTAPI中的数据备份的迷你图列表

    现在我遇到了一个问题,在
    节点上的每次迭代中,所有的迷你图值都设置为实际迭代的值。但是这只发生在
    历史
    绑定中,而不是
    节点.id
    绑定中

    我有没有漏掉一点

    节点列表

    <polymer-element name="node-list">
      <template>
        <core-ajax
          auto
          url="http://demonstrator.herokuapp.com/nodes"
          handleAs="json"
          response="{{nodes}}"></core-ajax>
        <template repeat="{{node in nodes}}">
          <core-ajax
            auto
            url="http://demonstrator.herokuapp.com/node/{{node.id}}/hist_bandwidth"
            handleAs="json"
            response="{{history}}"></core-ajax>
          <sparkline-chart values="{{history | filterHistory}}"></sparkline-chart>
          <h4>{{history | filterHistory}}</h4>
          <h4>{{node.id}}</h4>
        </template>
      </template>
    
      <script>
        Polymer('node-list', {
          filterHistory: function (data) {
            if (data) {
              return _(data.histBandwidth.data).pluck('bandwidth').last(20).valueOf();
            }
          }
        });
      </script>
    </polymer-element>
    
    <polymer-element name="sparkline-chart" attributes="values width">
    <template>
        <span id="values">{{values}}</span>
        <h4>{{values}}</h4>
    </template>
    
    <script>
        Polymer('sparkline-chart', {
            width: 100,
    
            created: function () {
                this.values = [0];
            },
    
            domReady: function () {
                $(this.$.values).peity('line', { width: this.width, fill: 'none' });
            },
    
            valuesChanged: function () {
                $(this.$.values).change();
            }
        });
    </script>
    </polymer-element>
    
    
    {{历史|过滤历史}
    {{node.id}
    聚合物(‘节点列表’{
    过滤器历史记录:功能(数据){
    如果(数据){
    返回(data.histBandwidth.data).pull('bandwidth').last(20).valueOf();
    }
    }
    });
    
    迷你图

    <polymer-element name="node-list">
      <template>
        <core-ajax
          auto
          url="http://demonstrator.herokuapp.com/nodes"
          handleAs="json"
          response="{{nodes}}"></core-ajax>
        <template repeat="{{node in nodes}}">
          <core-ajax
            auto
            url="http://demonstrator.herokuapp.com/node/{{node.id}}/hist_bandwidth"
            handleAs="json"
            response="{{history}}"></core-ajax>
          <sparkline-chart values="{{history | filterHistory}}"></sparkline-chart>
          <h4>{{history | filterHistory}}</h4>
          <h4>{{node.id}}</h4>
        </template>
      </template>
    
      <script>
        Polymer('node-list', {
          filterHistory: function (data) {
            if (data) {
              return _(data.histBandwidth.data).pluck('bandwidth').last(20).valueOf();
            }
          }
        });
      </script>
    </polymer-element>
    
    <polymer-element name="sparkline-chart" attributes="values width">
    <template>
        <span id="values">{{values}}</span>
        <h4>{{values}}</h4>
    </template>
    
    <script>
        Polymer('sparkline-chart', {
            width: 100,
    
            created: function () {
                this.values = [0];
            },
    
            domReady: function () {
                $(this.$.values).peity('line', { width: this.width, fill: 'none' });
            },
    
            valuesChanged: function () {
                $(this.$.values).change();
            }
        });
    </script>
    </polymer-element>
    
    
    {{values}}
    {{values}}
    聚合物(“迷你图”{
    宽度:100,
    已创建:函数(){
    这个值为[0];
    },
    domReady:函数(){
    $(this.$.values).peity('line',{width:this.width,fill:'none'});
    },
    值更改:函数(){
    $(this.$.values).change();
    }
    });
    
    胡须绑定始终引用模型对象上的属性(聚合元素中的默认模型对象是元素本身)。因此,在本例中,
    history
    指的是
    this.history
    ,它是一个单独的属性,并且会不断被各种ajax调用覆盖

    解决此问题的一种方法是使用
    历史
    每个
    节点
    如下所示:

    <core-ajax
      auto
      url="http://demonstrator.herokuapp.com/node/{{node.id}}/hist_bandwidth"
      handleAs="json"
      response="{{node.history}}"></core-ajax>
    <sparkline-chart values="{{node.history | filterHistory}}"></sparkline-chart>