Angular-父子之间传值

1、父—子
父组件传出:

html文件 在父组件中引用子组件
<app-test-child [name]=name></app-test-child>

ts 文件
public name = 'wyzTestValue'

子组件接受:

// 引用必要模块，这里简写了，使用的时候根据实际情况进行模块的引用
import { SimpleChanges, Input } from 'angular/core'
// 接受父组件传过来的数据
@Input() name:string
// SimpleChange这个模块，如果不取change的上一个数据，可以不用引用，直接使用this.name来进行逻辑处理
ngOnchange(change:SimpleChanges){
  cinsole.log(change.name)
}

2、子—父
子组件触发事件通知父组件:

html文件
<div (click)='demoClick'>demo</div>

ts文件
// 引用
import {Output, EventEmitter} from '@angular/core'
// 定义emit事件
@Output voted = new EventEmitter()
// 触发通知父组件
demoClick(){
this.voted.emit('1') // 在这里可以传值
}

父组件被触发:

html文件
<app-test-child (voted)='parentVoted($event)'></app-test-child>
ts文件
parentVoted(value){
  console.log(value)
}