Polymer和Angular：嘗試將數據從控制器傳遞到元素失敗

Question

我的問題是下一個：

1. 我有AngularJS應用程序，其中使用了自定義的Polymer元素；

2. 我有一個名為Main的控制器。 它處理/ main路由並使用自己的視圖-main.html ;

3. main.html中有my-element ；

4. 我在控制器中初始化一個集合，然后使用document.querySelector（'my-element'）。collection = $ scope.collection將其傳遞給元素。 當我直接打開/ main URL並加載頁面時，它可以工作。 但是，當我直接打開另一條路線然后轉到/ main時，它不起作用-因為控制器在 my-element工作的ready（）和create（）方法之后運行。

我在my-element create（）方法內使用setInterval（）解決了一個不好的解決方案。 請幫助初學者。

提前致謝！

 // my controller app.controller('MyController', function($scope, collection) { $scope.collection = collection; // resolved from the route }); // my element ready() method ... ready() { // without timeout it will throw an exception, because JSON.parse parses {{list}} string itself on route state change. setTimeout(function() { this.list = JSON.parse(this.getAttribute('list')); }, 300); } 

 <!-- MyController view --> <my-element list={{collection}}></my-element> 

Answer 1

您可以按以下方式使用聚合物數據綁定：

<polymer-element name="my-element" attributes="listJson">
  <template>
    ....
  </template>
  <script>
    Polymer({
      created: function() {
        this.list = [];
      },
      ready: function() {
        this.initList();
      },
      listJsonChanged: function() {
        this.initList();
      },
      initList: function() {
        this.list = JSON.parse(this.listStr);
      }
    })
  </script>
</polymer-element>

然后在視圖中：

<my-element listJson="{{collection}}"></my-element>