脚本加载后的聚合物计算绑定

Question

我正在创建一个利用moment.js的Polymer Web组件。 我创建了一个计算绑定，该绑定接受一个日期并返回一个由moment.js格式化的字符串。 问题是，有时此方法在应用程序加载moment.js库之前运行，从而导致变量未定义错误。 有没有一种方法可以等待我将值返回到视图或在调用计算函数时延迟呢？

请参见下面的代码示例：

<span>{{computedDate(date)}}</span>
<script>
    Polymer({
        ...
        computedDate: function(date) {
            return moment(date, "MM-DD-YYYY").fromNow()
        }
    })
</script>

Answer 1

如果您希望确定是否加载了moment.js，则可以动态加载它并等待load事件触发：

var script = document.createElement('script');
script.src = path/to/moment.js;
script.onload = function () {
  //here you know moment.js is loaded, so set the loaded "flag" to true
};

document.head.appendChild(script);

然后，在计算的绑定中监视加载标志的更改，仅使用为true的时刻：

<span>{{computedDate(date, loaded)}}</span>