角2はカスタムイベントをコンポーネント内部でリッスンします

Question

私が行うことは、作成されたコンポーネントと同じコンポーネントの内部でリッスンするカスタムイベントを作成することです。

events.component.ts

@Component({ 
    moduleId: module.id.replace("/dist/", "/"), 
    selector: 'event-bind-c', 
    template:` 
      <button (click)="onClicked()">Component click</button> 
      <input (clicked)="showIt($event)" [placeholder]="emitted_val"> 
      ` 
}) 
export class EventBindingComponent implements OnInit { 
    toggled_value:boolean = false; 
    emitted_val:string; 

    constructor() { } 

    ngOnInit() { } 

    @Output() clicked = new EventEmitter<string>(); 
    onClicked =() => { 
     //alert("Inside of component"); 
     this.clicked.emit("It works!"); 
    } 

    showIt = (event_val:string) => { 
     alert("event_val:" + event_val); 
     this.emitted_val = event_val; 
    } 
} 

Iは、（親に）成分の外にそれを使用する場合、それは動作

app.component.ts

@Component({ 
    selector: 'my-app', 
    template: '<event-bind-c (clicked) = "onParentClicked($event)"></event-bind-c>', 
}) 
export class AppComponent { 
onParentClicked= (value:string) => { 
    alert("Outside of component "+value); 
} 
} 

Answer 1

それはサポートされていません。

のみ親コンポーネントが@Output()

から放出されたイベントにバインドすることができますなぜあなただ​​けのイベントを発するのではなく、this.showIt()を呼び出すことはありませんか？