在组件模板中使用 eventEmitter.emit()

Question

编辑

我在 HTML 模板中引用了同名的 TemplateRef！

<ng-template #eventEmitter>

抱歉，仍然保留问题以参考错误代码。

老问题

我试图在组件模板中使用 something.component.html EventEmitter 实例的 emit() 方法作为

<div (click)="eventEmitter.emit()">click me</div>

并在我的组件中定义 something.component.ts like

@Output() eventEmitter = new EventEmitter<any>();

并得到以下错误

"jit_nodeValue_3(...).emit is not a function"

我在 the doc or guide 中找不到对此的任何参考，并且对这种行为很好奇，有人有真正的解释吗？

Answer 1

在 Output 上设置 EventEmitter：

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

@Component({
    selector: 'demo',
    template: `<h1>Demo</h1>
    <button (click)="notify.emit('hello')">Notify</button>`
})
export class DemoComponent {
    @Output() notify = new EventEmitter<any>();
}

正在订阅活动：

import { Component } from '@angular/core';

@Component({
    selector: 'app',
    template: `<h1>App</h1>
    <demo (notify)="receiveNotification($event)"></demo>`
})
export class AppComponent {
    notifications = new Array<any>();

    receiveNotification(notification: any) {
        this.notifications.push(notification);
    }
}

完整 example in StackBlitz

在组件模板中使用 eventEmitter.emit()

use eventEmitter.emit() in component's template

components

eventemitter

angular

编辑

老问题