親ディレクティブ内に子ディレクティブを持つ一般的な角1.xパターンを角2で実装したいと思います。角2の子コンポーネントイベントが親にブロードキャストされる
<foo>
<bar>A</bar>
<bar>B</bar>
<bar>C</bar>
</foo>
これらBar
コンポーネントはFoo
コンポーネントに放出されますクリックイベントを持っているため、私はしたいと思います。
@Component({
selector: 'foo',
template: `
<div>
<ng-content></ng-content>
</div>
`
})
export class Foo {
@ContentChildren(Bar) items: QueryList<Bar>;
}
そして、ここにある私のBar
:
Foo
だ
@Component({
selector: 'Bar',
template: `
<div (click)="clickity()">
<ng-content></ng-content>
</div>
`
})
export class Bar {
clickity() {
console.log('Broadcast this to the parent please!');
}
}
私はそのBars
の1がクリックされるたびにFoo
を知らせる行くにはどうすればよいですか?
。 「@Output()」または[この例のような]サービスを介して(http://stackoverflow.com/a/34576997/1876949) – Sasxa
@Sasxaあなたは明確にすることができますか? @Output()を子から親に使う方法を知っていますが、実際に子コンポーネントに属性を置くことができる場合のみです。私はそれをユーザー定義の子で動的に行う方法を知らない。 – Harangue
tbh、私は '@Output()'をあまり使っていませんでした...私はサービスを好む、私は両方のクラスでインポートし、エミッタの同じインスタンスを要求し、emit/subscribeを登録します。分の例を作成するには... – Sasxa