dom-repeat内の値をリセット

Question

私はPolymerでdom-repeatを使用しています。対応するリストには、dom-repeatのリストがリセットされるたびに設定されるべき初期値が含まれる。しかし、リストの最初の要素が同じ初期値を保持している場合、リストを完全に空にしてから新しい値にリセットしても、値はリセットされません。ここに私の最小の例です：

<dom-module id="console-app"> 
    <template> 
    <div id="command-selection"> 
     <paper-dropdown-menu id="command" label="Function"> 
     <paper-listbox slot="dropdown-content" selected="{{_commandIndex}}"> 
      <paper-item>A</paper-item> 
      <paper-item>B</paper-item> 
     </paper-listbox> 
     </paper-dropdown-menu> 
    </div> 

    <div id="parameters"> 
     <template is="dom-repeat" items="[[_parameterData]]"> 
     <parameter-block name="[[item.name]]" initial-value="[[item.initialValue]]" ></parameter-block> 
     </template> 
    </div> 
    </template> 

    <script> 
     class ConsoleApp extends Polymer.Element { 

      static get is() { 
       return 'console-app'; 
      } 



      static get properties() { 
       return { 
        _commandIndex: { 
         type: Number, 
         value: -1, 
         observer: '_onIndexChange' 
        }, 

        _parameterData: { 
         type: Array, 
         value:() => { return []; } 
        } 
       }; 
      } 

      _onIndexChange() { 
       this.set('_parameterData', []); 

       switch (this._commandIndex) { 
        case 0: 
         this.set('_parameterData', [ 
          { name: 'AAA', initialValue: '111'}, 
          { name: 'BBB', initialValue: '123'} 
         ]); 
         break; 

        case 1: 
         this.set('_parameterData', [ 
          { name: 'CCC', initialValue: '112'} 
         ]); 
         break; 

       } 
      } 
     } 

     customElements.define(ConsoleApp.is, ConsoleApp); 
    </script> 
</dom-module> 

パラメータブロック：

<dom-module id="parameter-block"> 
    <template> 
    <paper-input id="non-bool-value" label="[[name]]" 
       value="{{_value}}"></paper-input> 
    </template> 

    <script> 
     class ParameterBlock extends Polymer.Element { 

      static get is() { 
       return 'parameter-block'; 
      } 



      static get properties() { 
       return { 
        _value: { 
         type: String, 
         value:() => { return ''; } 
        }, 

        initialValue: { 
         type: String, 
         value:() => { return ''; }, 
         observer: '_onInitialValueChange' 
        }, 

        name: { 
         type: String, 
         value:() => { return ''; } 
        } 
       }; 
      } 



      _onInitialValueChange() { 
       this.set('_value', this.initialValue); 
      } 
     } 

     customElements.define(ParameterBlock.is, ParameterBlock); 
    </script> 
</dom-module> 

ドロップダウンメニューの変更のインデックスは、私が[]に_parameterDataをリセットし、その後_parameterDataに将来のすべての変更が評価されていることを前提としています場合には新しい要素として。しかし、リストは対応するリスナーが呼び出されず、前の初期値を覚えているようで、最初のテキスト要素の前回の変更は選択を変更しても111にリセットされないようです。私が異なる初期値を使用すると、すべて正常に動作するので、私はPolymerに何らかの理由で適切に要素をリセットする必要があると仮定しますが、どうすればよいでしょうか？

Answer 1

initialValueを観察しているだけなので、変更したinitialValueが異なるnameであることがアプリケーションに分かりません。そのため、割り当てたデフォルト値にリセットされません。

プロパティnameとinitialValueの両方を観察する必要があります。私が提供plnkr linkを更新しました

_onInitialValueChange(name, initialValue) { 
    this.set('_value', this.initialValue); 
    } 

：

static get observers() { 
    return [ 
     '_onInitialValueChange(name, initialValue)' 
    ] 
} 

し、あなたの方法に：だから、あなたへのオブザーバーのコードを変更します。