如何在角度2中使用ViewChild？

Question

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

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

这是标题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;
 }
}

但它发送此错误：无法设置属性＆＃39;显示＆＃39;未定义的

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