Question

在我的导航标题中，我有一个与click事件绑定的值。当用户点击它时，我需要将该值发送到name组件。目前得到错误。任何人帮助我？

标题组件：

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() {}

}

Answer 1

删除输出

public dropDown:boolean = true;

并在您的模板中

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

发现难以从标头组件发送值到模态组件

1 个答案: