web - Double Brackets [[ ]] vs Double Braces {{ }} in Polymer

Question

What's a succinct way to explain the difference between double brackets ([[...]]) and double braces ({{...}}) in Polymer 1.0?

For instance, in the documentation for the <iron-list> element the sample HTML shows:

<template is="dom-bind">
  <iron-ajax url="data.json" last-response="{{data}}" auto></iron-ajax>
  <iron-list items="[[data]]" as="item">
    <template>
      <div>
        Name: <span>[[item.name]]</span>
      </div>
    </template>
  </iron-list>
</template>

Why is data bounded by double braces in one spot (last-response="{{data}}") but bounded by double brackets (items="[[data]]") in another spot?

Answer 1

Binding can be either one-way (using [[]]) or two-way (using {{}}, but also use notify).

To explain *-way binding think traffic. one-way binding is when you update model, the view gets updated. When the vice-versa is also true it is a two-way binding.

For more information see the documentation.