在头部组件的Angular 2中，我有一个注册按钮，如果单击它，将打开一个模态对话框 . 我已经制定了方法和其他方法 . 并且在主页面中，如果我单击一个按钮（它的名称是继续），它是一个单独的组件我希望当我单击 Headers 中的注册按钮时，该模式对话框正好打开 . 我尝试使用@ViewChild方法：这是标头html：

<a class="button" type="button" (click)="showDialog()" >sign up</a>

这是 Headers ts：

import {Component, OnInit} from '@angular/core';
@Component({
selector: 'header-component',
templateUrl: './header.component.html',
})
export class HeaderComponent implements OnInit {
display: boolean = false;
showDialog() {
this.display = true;
}

这是在另一个组件中使用该按钮：

<button [disabled]="!propertyForm.form.valid"
                      (click)="onSubmit($event)" type="submit">continue</button>

而组件是：

import {Component, Input, ViewChild,ViewEncapsulation } from '@angular/core';
import {HeaderComponent} from "./header.component";
@Component({
templateUrl:'./add-property.html',
providers: [DataService, Amlak],
encapsulation: ViewEncapsulation.None,
moduleId:module.id
})
export class AddPropertyComponent {
@ViewChild(HeaderComponent)
private headerComponent: HeaderComponent;
onSubmit($event) {
this.headerComponent.display=true;
 }
}

但它发送此错误：无法设置undefined的属性'display'

感谢您以简单，最简单的方式提供帮助 .

angular