Search code examples
polymerdataflow

How to pass changed Array data from Target to Host element in Polymer 2.0?

I have an array in host element which is passed to target element using binding. Now, I would like to change the array data in my target element making sure that the array data in my host element is also updated when I make changes to array in target element.

Solution

  • This are the steps you need to check :

    1. At child element (in your term : target) , you need to declare property with notify:true

      static get properties() {return { myArray: { type:Array, notify:true }}}

    2. Allow two-way binding at the parent (your word: host) with curly brackets something like:<child-elem my-array="{{myArray}}"></child-elem>

    3. At the child element, you need to modify array with some of below in order to observable changes at parent; this.push(path, item1, [..., itemN]) this.pop(path) this.unshift(path, item1, [..., itemN]) this.shift(path) this.splice(path, index, removeCount, [item1, ..., itemN])