父组件和子组件通信

此处推荐四种方式

方式一:

共享服务:即写一个服务,然后把服务引进需要的组建即可调用其方法

方式二:

"#"引用:即在页面的子组件中添加#引用,代表子组件,即可操作子组件属性和方法

              

               <button  (click)=myChild.func1()>提交</button>
                <app-component #myCilid></app-component>

方式三:

@Input和@Output进行传参和事件触发

方式四:

@viewChild 引入子组件

                  import {Component, ViewChild} from '@angular/core';
import { userFile } from './childen/user.component'

@Component({
selector: 'app-parent',
  templateUrl: './parent.component.html',
  styleUrls: ['./parent.component.css']
})

export class ParentComponent {
@ViewChild(userFile) user:
userFile ;

  OnClick() {
     this.user.fun1();
    }
}
 
原文地址:https://www.cnblogs.com/mttcug/p/8243787.html