從聚合物模板觸發角度方法

Question

聚合物模板

  Sample.html
       <dom-module id="sample">
           <template>
           <paper-button id="clickme" on-click=         
                                "clickMe()">click</paper-button>
            </template>
       </dom-module>

 sample.ts
       export class sample controller{
             clickMe(){
                 console.log("button clicked from polymer app");
               }
          }

我可以將數據從角度應用程序傳遞到聚合物組件，是否有任何方法可以觸發來自聚合物組件的角度事件。

Answer 1

使用所需的數據從Polymer調度事件，並在Angular中偵聽事件。

聚合物：

<dom-module id="sample-element">
  <template>
    <paper-button on-click="clickMe">click</paper-button>
  </template>
  <script>
    Polymer({
      is: 'sample-element',
      clickMe: function() {
        this.dispatchEvent(new CustomEvent('sample-element-data', {
          detail: 'Hello from Polymer'
        });
      }
    });
  </script>
</dom-module>

角度：

@Component({
  template: '<sample-element (sample-element-data)="handleEvent($event)"></sample-element>'
})
export class SampleAngularComponent {
  handleEvent(e: CustomEvent) {
    console.log(e.detail); // 'Hello from Polymer'
  }
}