数据绑定

文档: 数据绑定属性绑定绑定到数组项计算绑定

不要忘记:聚合物驼峰案例属性,所以如果在 JavaScript 中你使用 myProperty,在 HTML 中你会使用 my-property

单向绑定:当 myProperty 发生变化时,theirProperty 会更新:

<some-element their-property="[[myProperty]]"></some-element>

双向绑定:当 myProperty 发生变化时,theirProperty 会更新,反之亦然:

<some-element their-property="{{myProperty}}"></some-element>

属性绑定 :当 myPropertytrue 时,元素被隐藏; 当它是 false 时,元素是可见的。属性和属性绑定之间的区别在于属性绑定等同于 someElement.someProp = value,而属性绑定等同于:someElement.setAttribute(someProp, value)

<some-element hidden$="[[myProperty]]"></some-element>

计算绑定 :当 myProperty 更改时,绑定到 class 属性将重新编译样式:

<some-element class$="[[_computeSomething(myProperty)]]"></some-element>
<script>
_computeSomething: function(prop) {
  return prop ? 'a-class-name' : 'another-class-name';
}
</script>