Polymer 2 更新 paper-listbox 项目

Question

我有一个 name 属性的对象集合。为了编辑这些对象，我有一个纸质列表框，其中列出了对象的名称，并让用户 select 按名称选择其中一个对象。在列表框旁边，我有一个带有纸张输入等的表单，用于编辑 selected 对象的属性。纸张输入之一绑定到 selected 对象的名称属性，因此用户可以更改名称。

我的问题是对名称属性的更改没有反映到列表框中。用户更改名称后如何更新列表框？

我确认名称更改确实发生了，因为当我更改为另一个对象并返回到前一个对象时，更改后的名称仍然存在。问题只是列表框没有更新。

我试过类似的方法：

this.notifyPath("myObjects")

但这没有任何作用。

paper-listbox是这样创建的

<paper-listbox selected="{{selectedObjectIndex}}">
    <template is="dom-repeat" items="[[myObjects]]">
        <paper-item>[[item.name]]</paper-item>
    </template>
</paper-listbox>

selectedObjectIndex 有一个观察者设置 selected 对象

selectedPageIndexChanged(newValue, oldValue) {
    ...
    this.selectedObject = this.myObjects[this.selectedObjectIndex];
}

Answer 1

下面是一些有效和无效的例子。（我在codepen中尝试将代码说明为show DEMO，这里也放了部分代码，以便快速查看。

 <paper-listbox selected="{{selectedObjectIndex}}">
  <template is="dom-repeat" items="{{myObjects}}" >
    <paper-item>[[index]].[[item.name]]</paper-item> <br/>
  </template>
 </paper-listbox>
 <paper-input value="{{selectedObject.name}}" ></paper-input>

.....

     selectedObjectIndex:{
           type:Number,
           observer:'selectedPageIndexChanged'
         }
      }} 
      static get observers() {return ['nameValueChanged(selectedObject.name)']}
      constructor() {
            super();
       }

       ready() {
            super.ready();

        }

  selectedPageIndexChanged(newValue, oldValue) {

      this.selectedObject = this.myObjects[newValue];
  }
 nameValueChanged(name){
      //this.myObjects[this.selectedObjectIndex].name = name;
      //this.set('myObjects.' + this.selectedObjectIndex + ".name", name ) // --> Does not work
      this.set('myObjects.' + this.selectedObjectIndex, { name: name} ) // --> Works
      // this.splice('myObjects', this.selectedObjectIndex,1, this.selectedObject) -- Does not work

      //this.notifyPath('myObjects.' + this.selectedObjectIndex + ".name") // -- works (with one of above)

 }
}

上面带符号的 Does not work 行更改了对象但在 dom-repeat

处不可观察

Polymer 2 更新 paper-listbox 项目

Polymer 2 update paper-listbox item

polymer

polymer-2.x