Polymer1.0 - How to change Boolean in Child when Boolean in Parent changes

Question

I need a child element to know when a value in the parent element changes. I have tried using curly braces, square brackets, the dollar sign, and every combination of those, but nothing works. When you click the button in the parent the child element doesn't get the updated value.

What do I need to do to

<dom-module id="parent-element">
  <template>
    <child-element childBoolean="[[parentBoolean]]"></child-element>
    <button on-tap="_toggle">toggle</button>
  </template>

  <script>
    Polymer({
      is: 'parent-element',
      properties:{
        parentBoolean:{
          type:Boolean
          value:false
        }
      },
      _toggle:function(){
        this.parentBoolean = !this.parentBoolean;
      }
    </script>
</dom-module> 



<dom-module id="child-element">
  <template>
    the value is [[childBoolean]]
  </template>

  <script>
    Polymer({
      is: 'child-element',
      properties:{
        childBoolean: Boolean
        }
      }
    </script>
</dom-module>

Answer 1

The answer is camelCase. I'm posting this answer in case anyone has a similar issue.

I named the variables using camel case, like so:

parentBoolean childBoolean

but whenever Polymer sees camelCase variables, it assumes the variable contains dashes. changing the variable names to:

parentboolean childboolean

fixed the issue.

Answer 2

Hey so this can be found in the documentation There is a Part where it is described how the Attribute mapping works.