从聚合物模板触发角度方法

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'
  }
}