Polimer 1.0 Array Obserwatorzy na zmianie wiązania

Question

Próbuję obserwować zmiany w tablicy obiektów, które są przekazywane do elementu polimerowego. Po dodaniu nowego elementu do tablicy, tablica jest również zmieniana w elemencie Polymer. Jednak metoda obserwatora nigdy nie jest wywoływana.

Zawierające element

<dom-module is="table-container"> 
    <template> 
    <selectable-table table-items="{{items}}"></selectable-table> 
    <button on-click="addItem">Add Item</button>  
    </template> 
    <script> 
    Polymer({ 
     is : "table-container", 
     attached : function() { 
     this.items = []; 
     for (var i = 0; i < 3; i++) { 
      this.push("items", { 
      numerical: "1", 
      english: "one" 
      }); 
     } 
     }, 
     addItem : function() { 
     this.push("items", { 
      numerical: "3", 
      english: "three" 
     }) 
     } 
    }) 
    </script> 
</dom-module> 

Starając się obserwować zmiany tutaj:

<dom-module id="selectable-table> 
    <template> 
    <div>{{tableItems}}</div> 
    </template> 
    <script> 
    Polymer({ 
     is : "selectable-table", 
     properties : { 
     tableItems: { 
      type: Object, 
      notify: true, 
      observer: "updateTableItems" 
     } 
     } 
     updateTableItems : function() { 
     // Updates here 
     } 
    }); 
    </script> 
</dom-module> 

W „updateTableItems” metoda jest wywoływana na początku, kiedy tablica elementów jest najpierw wypełniane ale nigdy po kliknięciu przycisku aby dodać więcej obiektów.

Answer 1

Aby obserwować zmiany w tablicy, należy stosować następujący styl obserwatorów.

Polymer({ 
    is : "selectable-table", 
    properties : { 
    tableItems: { 
     type: Array, 
     notify: true, 
    } 
    }, 

    observers: [ 
     'updateTableItems(tableItems.*)' 
    ], 
    updateTableItems : function() { 
    // Updates here 
    } 
}); 

Ponieważ tableItems jest tablicą obiektów, należy użyć typu Array w deklaracji właściwości. Typ obserwatora, którego używasz, wyzwoli tylko, jeśli przypiszesz nową instancję tablicy do właściwości tableItems. Aby manipulować tablicą, dodaj swój callback do observers. Więcej informacji znajdziesz w docs.