将函数调用作为属性传递给Polymer？

Question

我的Polymer元素具有一个数组属性，该属性的范围为1-10,000，因此我需要在实例化该元素时生成它。 但是，我真的很想使用函数调用或引用来传递数组：

<script>
  function genArray(size){
    var a = [];
    for(var i = 0, count = size - 1; i < count; i++){
      a.push("domain" + count + ".tld");
    }
    return a;
  }
</script>

<my-element domains="genArray()"></my-element>

或引用全局对象。

<script>
  function genArray(size){
    var a = [];
    for(var i = 0, count = size - 1; i < count; i++){
      a.push("domain" + count + ".tld");
    }
    return a;
  }

  window.myArray = genArray(1000);
</script>

<my-element domains="window.myArray"></my-element>

我已经尝试过在引号样式（ "" vs '' ）括号（ "{{genArray}}" ）上进行变体，甚至使用'{"array":window.myArray}' 。

我了解可以传递参数或对全局对象的引用，并在生命周期回调中对其进行处理。 但是，如果我可以传递对外部函数的调用，它将更加干净，并且可以简化测试/部署。 我只是搞砸了，直到ES7中出现模板字符串？

Answer 1

绑定仅在Polymer环境中有效，但是有解决方案！ Polymer提供了一个称为dom-bind的辅助组件，您可以在页面中的任何位置使用它，甚至在Polymer元素之外：

<script>
  function genArray() {
      ...
  }

  window.myArray = genArray(1000);
</script>
<template is="dom-bind">
  <my-element domains="[[myArray]]"></my-element>
</template>

有关此组件的更多文档，请访问https://www.polymer-project.org/1.0/docs/devguide/templates.html#dom-bind