Polymer 1 nested dom-if within dom-repeat not updating when data changes

Question

How do you make dom-if templates within dom-repeat's update when the data changes??

Example here http://jsbin.com/xatala/edit?html,output

In the example the data changes after 1.5 seconds but the dom-if's inside the template aren't re-evaluated/rendered. You can see this in the console.log. The data has changed but the view isn't updated.

How would you make this work and what is the reasoning behind it?!

Answer 1

Here is example that works: http://jsbin.com/nejadibuju/edit?html,console,output

<template is="dom-if" 
  if="{{arrayItem(myItems.*, index, 'isGood')}}">
      [[item.title]] is SOOO good.
</template>

What you were missing is:

Explicit bindings to array items by index isn’t supported

Some explanations are added in the Bin. Related links:

Polymer, binding to array items not working

http://plnkr.co/edit/aOmw4e?p=preview