Use @output subassembly angular data acquisition assembly and method of the parent

1, and sub-assembly is introduced Output EventEmitter

import { Component, OnInit ,Input,Output,EventEmitter} from '@angular/core';
<app-header (outer)="runParent($event)"></app-header>

2. The subassembly EventEmitter instantiate objects: outer

@Output() private outer=new EventEmitter<string>();
/*用 EventEmitter 和 output 装饰器配合使用 <string>指定类型变量*/

3, sub-assembly through outer instance broadcast data objects EventEmitter

 

sendParent(){
// alert('zhixing');
this.outer.emit('msg from child')
}

4. Object outer EventEmitter time to call the parent component sub-assemblies, receiving a definition of the event, is the outer subassembly

The parent component receives data calls his runParent method, this time will be able to get the data subcomponents

//接收子组件传递过来的数据
runParent(msg:string){
alert(msg);
}

 

Published 17 original articles · won praise 3 · views 20000 +

Guess you like

Origin blog.csdn.net/qq_36547601/article/details/84345080