通知聚合物复合物对象已更改

时间:2015-12-01 05:25:30

标签: polymer polymer-1.0

如果数据绑定复杂对象的成员发生更改,如何触发模板刷新?

在模板中:

<other-component data="{{complexObject}}"></other-object>

在组件中:

_onChange: function(newData) {
   //callback from some event-system
   this.set("complexObject", newData);
}

更改complexObject时会触发_onChange - 方法,但newData始终是对同一对象的引用,只是此对象的成员发生了更改 - 因此,聚合物不会更新视图并没有将数据传递给other-component

有没有办法让聚合物知道确实存在一些新数据并且必须重新评估模板?如果我创建一个newData的浅层克隆,它会起作用,但这看起来像是一个黑客,可能会损害大型对象的性能。

我无法使用set方法通过路径更改对象的属性,因为更改发生在聚合物元素之外,我无法控制它。

3 个答案:

答案 0 :(得分:0)

调用render()

this.$.yourTemplateID.render();

答案 1 :(得分:0)

以下是一个工作示例,其中兄弟元素在彼此之间交换数据:Plunk

文档:https://www.polymer-project.org/1.0/docs/devguide/data-binding.html#array-binding

<template>
  <button on-tap="btnTapped">change Emploees from Second</button>
              second: empl: <span>{{empl.employees.0.firstName}}</span>
</template>
...
<script>
btnTapped: function () {

    console.log('Second: btnTapped');

    //Propagate array subproperty
    this.set('empl.employees.0.firstName', 'Test');
    console.log(this.empl.employees[0].firstName);


    //Object set
    this.set('temp.firstName', 'Test');

  }
</script>

答案 2 :(得分:0)

-Xmx2048M -Xss128M -XX:MaxPermSize=2048M -XX:+CMSClassUnloadingEnabled -XX:+UseConcMarkSweepGC

克隆&amp;重新分配可能会解决这个问题。