使用`ViewChild`-方法未调用子方法 [英] using `ViewChild` - method is not calling the child method

问题描述

我正在尝试从父级调用我的子级组件方法，但根本不起作用.

I am trying to call my child components method from the parent, but not works at all.

这是我的代码:

<router-outlet>
   <app-modal-popup></app-modal-popup> //children for all pages!!
</router-outlet>

在主页中:

    import { Component, OnInit, Output, ViewChild, AfterViewInit  } from '@angular/core';
    import { ModalPopupComponent } from '../../shared/modal/modal-popup/modal-popup.component';

    export class HomeComponent implements OnInit, AfterViewInit {

        @ViewChild('appModal') private appModal : ModalPopupComponent;

    footerLinkHandler(link){
        console.log('link', link );
        this.appModal.popMessage(link);
        return false;
    }

}

但出现错误，因为无法读取未定义的属性'popMessage'-问题是什么.但是我从 appModal 中获取了 popMessage 作为自动填充.

but getting an error as Cannot read property 'popMessage' of undefined - what is the issue. But i am getting the popMessage from appModal as auto filled.

推荐答案

尝试一下

@Component({
 ...
directives: [ModalPopupComponent]
})

class HomeComponent implements OnInit, AfterViewInit{
 @ViewChild(ModalPopupComponent) childComp:ModalPopupComponent;
 ...
 footerLinkHandler(link){
    console.log('link', link );
    this.childComp.popMessage(link);
    return false;
 }

这篇关于使用`ViewChild`-方法未调用子方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！