如何使用Angular 2.0的铁列表

我正试图在Angular 2.0中使用铁列表.我已经在使用其他polymer 1.0组件了,但是铁列表在很大程度上依赖于Light DOM.我知道我可以删除并且只是为了列表中的内容,但我认为这不会很好.有人有主意吗.

解决方法

这里的问题是Angular 2解析< template>尽管它们应留在polymer Templatizer里面< iron-list>.

根据我的经验,处理这种情况的最好方法是包装< iron-list>在自定义polymer元素内部,并在那里定义模板.

<dom-module id="heroes-list">
  <template>
    <style>
      :host {
        display: block;
      }
    </style>
    <iron-list items="[[items]]" selection-enabled selected-item="{{selectedItem}}">
     <template>[[item]]</template>
    </iron-list>
  </template>
  <script>
    polymer({
      is: 'heroes-list',properties: {
        items: {
          type: Array
        },selectedItem: {
          type: Object,notify: true
        },}
    });
  </script>
</dom-module>

然后可以在任何具有双向绑定的Angular 2应用程序中使用此元素,如下所示：

<heroes-list [items]="heroes" (selected-item-changed)="myHero=$event.detail.value">