angular8 父子组件之间的通信 @ViewChild @Input

@ViewChild 在父组件中调用子组件

头部组件用到新闻组件中
news

<app-header #header></app-header>
<button (click)="getChildClick()">

new.ts

import {ViewChild} from "@angular/core"
@ViewChild('header') header:any;
getChildClick(){
    this.header.run()
    var d = this.header.msg
}

header.ts

public msg:any='123'
run(){
    alert('111')
}

或 output EventEmitter 也可实现

子组件中引入   import {Output,EventEmitter} from "@angular/core"
@Output() outer = new EventEmitter()
this.outer.emit(''子组件数据)
父组件调用  <app-header (outer)="run($event)">

子组件接受数据

父组件调用子组件时传入数据

<app-header [msg]='123' [run]="run" [home]="this"></app-header>
[home]="this"   home 传入组件    this  当前组件

子组件引入接收

引入  import {Input} from "@angular/core" 
@Input()  msg:string;
@Input()  run:any;
@Input()  home:any;
{{msg}}
get(){
   this.run()
   this.home.msg
}