Question

我有一个自定义元素，我想从我的索引.html页面中读取一个属性值。该元素如下所示，简化：

<polymer-element name="card-list" attributes="JSONsource lastUpdatedOn">
<template>
  ...
 </template>
<script>
  Polymer('card-list', {
    created: function() {
      this.lastUpdatedOn = 'init';
      setInterval(ajaxReload, 5000);
    }
  });
    
  var ajaxReload = function() {
      console.log('reload'); 
      updateSyncTime();     
  }
  var updateSyncTime = function() {
    var today = new Date();
    var h = today.getHours();
    var m = today.getMinutes();
    // add a zero in front of numbers<10
    h = checkTime(h);
    m = checkTime(m);
    this.lastUpdatedOn = h + ':' + m;
    console.log(this.lastUpdatedOn);
  }
  var checkTime = function(i) {
    if (i < 10) {
        i = '0' + i;
    }## Heading ##
    return i;
  }
  
</script>
</polymer-element>

我可以访问此lastUpdatedOn属性以在index.html中显示它。我试过这样的事：

<card-list JSONsource="http://sbewepas118:58573/AllergenStatusService.svc/lineinfo" lastUpdatedOn ="{{ lastUpdate }}" > </card-list>

在其他地方，我有一个文本，其中包含{{lastUpdate}}。在加载页面时，{{lastUpdate}}被'init'替换，我从中得出结论聚合物正确地替换了{{lastUpdate}}，但它只是具有我最初设置为lastUpdatedOnProperty的值。在ajax-update之后更新属性时，索引页不会检测到它。

如何在index.html页面中查看此属性的值更改，而该页面不是聚合物元素？

谢谢，

Answer 1

这里有一个关于如何“利用Polymer的onMutation函数来监视对DOM节点的更改”的示例： How can I know that Template Repeat has finished?

至于在Polymer元素之外进行，请使用template is="auto-binding"

如何从index.html观察聚合物元素属性值的变化

1 个答案: