首页 文章

Angular：事件和“订阅不是函数”错误

提问于
浏览 次
40

大家好，感谢您阅读本文 .

我刚刚开始深入研究一些基本的Angular 4，并且我很难听到发出的事件 . 这是一个非常简单的例子，可以重现问题（至少在我的最后）：

DateSenderComponent 是"broadcasting"当前日期，然后由其父级 AppComponent 处理（见下文）：

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

@Component({
  selector: 'app-date-sender',
  template: '<button (click)="sendDate()">Send</button>'
})

export class DateSenderComponent {
  @Output() dateSent = new EventEmitter();

  sendDate(){
    var dt = new Date();
    console.log(dt);
    this.dateSent.emit(dt.toString());
  }
}

AppComponent 应该收听广播的日期事件：

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

@Component({
  selector: 'app-root',
  template: '<app-date-sender (dateSent)="dateReceived($event)"></app-date-sender>'
})

export class AppComponent {
  dateReceived(value){
    console.log('Result: ', value);
  }
}

从各种初学者教程中我发现这是听取事件的方式 . 但是，加载页面时，我得到以下错误，而不是打印出收到的日期值：

AppComponent.html：1 ERROR TypeError：instance [output.propName] .subscribe不是createViewNodes（core.es5.js：12086）的createDirectiveInstance（core.es5.js：10727）中的函数，位于callViewAction（core.es5） . js：12530）execComponentViewsAction（core.es5.js：12439）at createViewNodes（core.es5.js：12113）at createRootView（core.es5.js：11991）at callWithDebugContext（core.es5.js：13206）at Object ComponentFactoryBoundToModule.create（core.es5.js：3448）的ComponentFactory_.create（core.es5.js：9912）处的.debugCreateRootView [as createRootView]（core.es5.js：12666）

不幸的是，我无法找到任何关于这实际意义的信息，我也无法自己弄明白 .

有一件事似乎是提示：当我更改 AppComponent 模板以侦听某些不会在任何地方发出的事件时（例如 <app-date-sender (someStringSent)="dateReceived($event)"></app-date-sender> ），则错误消失 . 因此，实际输出事件和监听它的模板之间似乎存在联系，这似乎是问题的原因 .

谁能指出我正确的方向？非常感谢提前 .

angular typescript

2 回答

  • 26

    我相信 EventEmitter 应该来自 '@angular/core' ？

    我在你的代码中看到它来自 'events' .

    您确定它是您正在使用的正确对象吗？

    回复于
  • 133

    问题出在这里：

    import { EventEmitter } from "events";

    您必须从 @angular/core 导入 EventEmitter ，如下所示：

    import { EventEmitter } from "@angular/core";
    回复于

相关问题