Question

我希望有一个源提供我的所有数据。一个模型，如果你愿意，我希望我的元素能够利用这些数据，但永远不会改变它（单向数据绑定）。我怎么能这样做？我应该将数据添加为行为吗？

我在我的文档中尝试过这样做：

<script type="text/javascript" src="/data.js"></script> <!-- defines a global object named DATA -->
<my-element data="{{DATA}}"></my-element>

这是在my-element.html

中

<dom-module id="my-element">
  <template></template>
  <script>
    Polymer({
      is: 'my-element',
      properties: {
        data: Object
      },
      ready: function () {
        console.log(this.data);
      }
    });
  </script>
</my-element>

但它似乎不起作用，this.data的值实际上是＆＃34; {{data}}＆＃34;。

我正在寻找比在dom-bind模板

中包装元素声明更好的解决方案

Answer 1

要使用数据绑定，您需要在聚合物元素内部或dom-bind元素内使用它。请参阅解释here。如果你使用dom-bind，它只是使用js将DATA设置为dom-bind模板元素上的属性的情况，'data'也许，这可能是很少的代码。

基本上，您无法设置全局并期望数据绑定以了解它。你需要通过在元素上设置属性，或者使用行为，或者使用Mowzer的方法来告诉关于它的dom-bind或关于它的元素，或者使用Mowzer的方法。

使用行为的一个例子是：

<link rel="import" href="databehaviour.html"> 
<link rel="import" href="bower_components/polymer/polymer.html">

<dom-module id="an-ele">

    <style>
    </style>
    <template>
        <div>{{data.sth}}</div>
    </template>
    <script>
        Polymer({
            is: "an-ele",
            behaviors: [DataBehaviour]
        });
    </script>

</dom-module>

行为是：

<script>
    DataBehaviour = {
        ready: function() {
            this.data = {'sth':'A thing! A glorious thing!'};
        }
    }
</script>

但在您的情况下，this.data将设置为您的DATA全局。

Answer 2

使用<iron-meta> [link]或<iron-localstorage>] [link]分享元素或主要文档之间的变量。

向Polymer元素提供数据

2 个答案: