使用して、サブアセンブリの角度データ収集アセンブリと親の方法を@input

@inputを使用して転送データに1

図1に示すように、入力データMSGから親コンポーネントアセンブリアプリヘッダを使用して。

 

<app-header [msg]="msg"></app-header>

図2に示すように、サブアセンブリに導入される入力 

import { Component, OnInit ,Input } from '@angular/core';

図3に示すように、サブアセンブリ@Input MSG：stringは、親コンポーネント上のデータ伝送を受信します

export class HeaderComponent implements OnInit {
@Input() msg:string
constructor() { }
ngOnInit() {
}
}

図4に示すように、親サブアセンブリコンポーネントのデータを使用して

{{MSG}}

2データ転送を使用して@input

実装の子コンポーネントは、親コンポーネントを呼び出します

図1に示すように、親コンポーネント定義方法

run(){
alert('这是父组件的 run 方法');
}

図2に示すように、配信方法は、（）の実行自己集合を使用することです

<app-header [msg]="msg" [run]="run"></app-header>

前記方法は、サブアセンブリ親要素を受信し、使用します

export class HeaderComponent implements OnInit {
@Input() msg:string;
@Input() run:any;
constructor() { }
ngOnInit() {
this.run(); /*子组件调用父组件的 run 方法*/
}
}