Angular parent 组件上的侦听事件出现 7 个问题

Question

我是 angular 的新手，我正在努力接收 parent 组件中的事件。我知道之前已经讨论过这个问题，但是不知何故 none 我阅读的提示或教程可以帮助我理解我做错了什么...

在我的 child component.ts 中，我做了这样的事情：

import { Component, EventEmitter, OnInit, Output } from '@angular/core'

@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css'],
  template: `<button class='btn btn-primary' (click)="nameChanged()">Click me</button> `
})
export class TestComponent implements OnInit {

    @Output() onTestEvent = new EventEmitter<string>()
    public text: string = "blah";

  constructor() { }

  ngOnInit() {
  }

  nameChanged() {
    console.log('Sending test event!');
    this.onTestEvent.emit(this.text)
  }
}

在我的 parent 组件 html 文件中，我做了这样的事情：

  <app-test>
    (onTestEvent)="handleTestEvent($event)"
  </app-test>

在我的 parent 组件 ts 文件中，我做了这样的事情：

  handleTestEvent(text: string) {
    console.log('handling test event....');
  }

我可以看到当我按下按钮时调用了 nameChanged 函数，但由于某些我无法理解的原因，我没有在 parent 组件中收到该事件...

Answer 1

必须进入标签内...

<app-test (onTestEvent)="handleTestEvent($event)">

</app-test>

Angular parent 组件上的侦听事件出现 7 个问题

Angular 7 problem with listening event on parent component

angular

eventemitter