CODEWITHSUNDEEP
javascriptpolymer
lazieburd
lazieburd

Reputation: 2786

How to force propertyChange event

I have a large 2 dimensional array where I update values in place and my other polymer elements do not get notified of changes. I have an idea why, and I think my solution is to force a property change event, but I'm not sure.

For a model element item like this...

<polymer-element name="my-model" attributes="rows">
...
<script>
  ...
  this.rows[0][0] = newValue;
</script>

I find when I use it in a view element like this...

<my-view rows="{{model.rows}}"></my-view>

where the view's implementation is like this...

<polymer-element name="my-view" attributes="rows">
<template>
   <template repeat="{{row in rows}}">
     <template repeat="{{col, i in cols}}">
       {{row[i]}}
     </template>
   </template>
</template>

my view does not get updated unless I reset the array value in the model

this.rows = []

Can I somehow force a property change event. I tried...

this.rows = this.rows

..and...

this.notifyPropertyChanged('rows', this.rows, this.rows)

and no luck. Any ideas would be appreciated. Thanks!

Upvotes: 0

Views: 114

Answers (1)

ebidel
ebidel

Reputation: 24109

There's a mistake in your second template. Since you're using named scoped, your second template needs to be {{col, i in row}}:

<template repeat="{{row in rows}}">
  <template repeat="{{col, i in row}}">

This worked for me: http://jsbin.com/sidagomu/1/edit

(click the element -> data updates -> template re-renders)

Upvotes: 2

Related Questions