子コンポーネントの変更について親にどのように通知するのですか？

Question

私はこのテンプレートを使用して子コンポーネントを持っている：

<p *ngIf="user != null" > 
    Id: {{user.id}}<br> 
    Name: {{user.firstName}} {{user.lastName}}<br> 
    Nick: {{user.nickname}}<br> 
    Gender: {{user.gender}}<br> 
    Birthday: {{user.birthday}}<br> 
    Last login: {{user.lastUpdateDate}}<br> 
    Registered: {{user.registrationDate}}<br> 
</p> 

私はhttpリクエストを使用してサーバーからユーザーを取得し、そのデータがロードされると、ユーザーが示されています。

データが読み込まれて表示されたことを親コンポーネントに通知するにはどうすればよいですか？

Answer 1

子コンポーネントで単にEventEmitterを使用するだけです（この例ではclickイベントで動作しますが、いつでもそのイベントを送信できます）。あなたはFinishボタンをクリックすると

@Component({ 
    selector: 'child-component', 
    template: ` 
    <button (click)="changeStatus(true)">Finish</button> 
    ` 
}) 
export class ChildComponent { 
    @Output() onStatusChange = new EventEmitter<boolean>(); 

    changeStatus(finished: bool) { 
    this.onStatusChange.emit(finished); 
    ... 
    } 
} 

@Component({ 
    selector: 'parent-component', 
    template: ` 
    <child-component 
     (onStatusChange)="childStatusChanged($event)"> 
    </child-component> 
    ` 
}) 
export class ParentComponent { 
    childStatusChanged(finished: boolean) { 
    if (finished){ 
     ... 
    } 
    ... 
    } 
} 

、それは我々が子供onStatusChangeイベントを発する子changeStatusメソッドを呼び出します。親コンポーネントのテンプレートに見られるように、親でキャッチされる可能性があります。これは、あなたがやりたいことを何でもして、childStatusChangedというメソッドを呼び出します。

は、親とはどういう意味ですか詳細