美文网首页
Angular 父子组件声明与访问

Angular 父子组件声明与访问

作者: 柳源居士 | 来源:发表于2018-11-23 09:02 被阅读0次

    父组件不能使用数据绑定来读取子组件的属性或调用子组件的方法。

    1. 如果父组件要访问子组件的属性或者方法,可以通过设置模板变量来实现。
      如下:
    template:`
    <button (click)="child.start()"></button>
    <app-child #child></app-child>
    `
    

    父组件引用了子组件<app-child>,并在子组件上声明了模板变量#child,可以通过#child访问子组件的属性及方法。本例点击按钮,调用了子组件的start()方法。
    模板变量有局限性,即只能通过父组件的模板来调用子组件的属性或者方法。
    当父组件的类要调用时,此方式就无法完成了。

    1. 父组件的类调用子组件。
      当父组件的类要调用时,把子组件作为ViewChild,注入到父组件中。
    @ViewChild(ChildComponent)
    private child:  ChildComponent;
    
    doSomthing(){
      this.child.start();
    }
    
    

    相关文章

      网友评论

          本文标题:Angular 父子组件声明与访问

          本文链接:https://www.haomeiwen.com/subject/mfpzfqtx.html