我遇到了一点麻烦，我似乎不明白为什么我的@ViewChild不工作。
基本上，我想从一个组件中调用另一个组件中的函数，所以在我的sidebar组件中，我有一个名为sendData()的函数，我希望能够从header组件中的按钮单击中调用它，所以我所做的是...

• • 边栏组件**

import { Component, OnInit, Input, OnChanges, SimpleChanges, AfterViewInit } from '@angular/core';

import * as _ from 'lodash';

@Component({
   selector: 'app-sidebar',
   templateUrl: './sidebar.component.html',
   styleUrls: ['./sidebar.component.scss']
})
export class SidebarComponent implements OnInit, OnChanges {

constructor(
    private contenfulService: ContentfulService,
    private userService: UserService
) { }

ngOnInit() {

}

sendData(){
    ...do something
}
}

• • 标题.组件. ts**

import { Component, OnInit, Input, ViewChild, EventEmitter } from '@angular/core';
 import { UserService } from '../../../user.service';
 import { SidebarComponent } from '../sidebar/sidebar.component';

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

 export class ProgramHeaderComponent implements OnInit {
 @ViewChild(SidebarComponent) sidebar;

    constructor() { }

    ngOnInit() {

    }
 }

• • 标题.组件. html**

<div (click)="sidebar.sendData()"></div>

但是它不起作用，我在控制台中得到这个错误...
错误类型错误：无法读取未定义的属性"sendData"

• 为简洁起见，我已删除代码，如果您需要更多信息，请告诉我 *

我不知道是什么问题？

• • 编辑**

或者，如果有人知道另一种从单独组件调用函数的方法，请告诉我
任何帮助将不胜感激!
谢谢!