Сложно отправить значение из компонента заголовка в модальный компонент

Question

В моем заголовке навигации у меня есть значение, которое связано с событием клика.когда пользователь нажимает на это, мне нужно отправить это значение в компонент modal.в настоящее время получаю ошибку.кто-нибудь мне помочь?

компонент заголовка:

import { Component, OnInit, Input, Output, HostListener } from '@angular/core';
import { CategoryMenuComponent } from '../shared/modal/category-menu/category-menu.component';

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

    hideLocations:boolean = true;

    @Output() dropDown:boolean = true;

    constructor() { }

    ngOnInit() {
    }

    locationHandler(){
        this.hideLocations = !this.hideLocations;
    }

    dropDownHandler(){
        this.dropDown = !this.dropDown; //need to send
    }

}

В приложении:

<div class="wrapper">
  <header>
    <app-header #dropDown></app-header>
  </header>
  <section>
    <router-outlet></router-outlet>
    <app-cookie-model></app-cookie-model>
    <app-category-menu [hideDropDownMenu]=#dropDown></app-category-menu>
  </section>
  <footer>
    <app-footer></app-footer>
  </footer>
</div>

в модальном компоненте:

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

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

    @Input() hideDropDownMenu:boolean;

    constructor() { }

    ngOnInit() {}

}

шаблон модальности:

<div class="dropdown-menu" [hidden]="hideDropDownMenu">
<ul>
        <li><a href="#">Shipping</a></li>
        <li><a href="#">Tracking</a></li>
        <li><a href="#">Service</a></li>
        <li><a href="#">Support</a></li>

</ul>

</div>

Answer 1

удалить вывод

public dropDown:boolean = true;

и в вашем шаблоне

  <app-category-menu [hideDropDownMenu]="dropDown.dropDown"></app-category-menu>