如何将数据从JavaScript代码传递到Polymer自定义元素？

Question

我想通过属性将我在变量上的数据传递给Polymer组件。

这是代码：

<script>
  var item1 = {
      title: "Title 1",
      status: "accepted"
  };
</script>

<bm-card item="{{item1}}" otherAttribute="hello">

otherAttribute 获取自定义元素的数据，但 item 未到达。

如何从 item1 变量中填充 item 属性？

Answer 1

要在<polymer-element>之外使用数据绑定，您需要<template is="auto-binding">： https://www.polymer-project.org/docs/polymer/databinding-advanced.html#bindingoutside

但是，您可以直接在js：

中设置属性

<bm-card otherAttribute="hello">

document.addEventListener('polymer-ready', function() {
  document.querySelector('bm-card').item = item1;
});

您必须等待聚合物就绪的原因是确保元素已在DOM中升级并定义了它的属性/方法。