【问题标题】:How to emit a @Output event in Angular 2如何在 Angular 2 中发出 @Output 事件
【发布时间】:2015-11-19 13:20:23
【问题描述】:

使用的 Angular 2 版本:2.0.0-alpha.44

我正在尝试从组件发出输出信号。我关注了 Angular 文档here .下面是我的组件的代码

@Component({
    selector: 'summary'
})
@View({
    directives: [NgFor, NgIf, ROUTER_DIRECTIVES, LogoutComponent, BarChartDirective, SunburstChartDirective],
    templateUrl: 'view/summary-component.html'
})
export class SummaryComponent {
    @Output() loadSummary: EventEmitter = new EventEmitter();
    project: Project;
    data: any;

    constructor(public http: Http,
            public router: Router,
            public xxxGlobalService: XXXGlobalService) {
        console.log("SummaryComponent: Created");
        this.getSummary()  
    }

    getSummary() {
        this.project = this.xxxGlobalService.getOpenedProject();
        var url = "/project_summary?username="+ this.xxxGlobalService.getUser().name + "&project_id=" + this.project.id;
        this.http.get(url)
                 .map(res => res.json())
                 .subscribe(
                     data => this.extractData(data),
                     err => this.logError(err),
                () => console.log('SummaryComponent: Successfully got the summary')
        );
    }

    extractData(data) {
        this.data = data;
        console.log("SummaryComponent: Emitting loadSummary event");
        this.loadSummary.next("event");
    }
}

但是,当我尝试分配 EventEmitter(下一行)时,我收到错误消息“TypeError: router_1.EventEmitter is not a function”

@Output() loadSummary: EventEmitter = new EventEmitter();

我检查了link 并将该行修改为看起来像

@Output() loadSummary: EventEmitter;

但 loadSummary 似乎始终未定义。 如何发出输出信号?请帮忙

【问题讨论】:

  • EventEmitter 必须从 angular2/angular2 导入,而不是从 angular2/router 导入。
  • @EricMartinez。非常感谢。它奏效了。
  • 对于 Angular2 beta 3 使用 import EventEmitter from 'angular2/core'

标签: javascript angular


【解决方案1】:

从 beta.0(可能更早)开始,EventEmitter 现在位于 angular2/core

使用emit() 发出事件:

@Output() loadSummary: EventEmitter<any> = new EventEmitter();
...
this.loadSummary.emit("event");

【讨论】:

  • 如果从构造函数发出,发出的事件似乎会丢失。显然 @Output 直到构造函数之后才被绑定。
猜你喜欢
  • 1970-01-01
  • 2018-09-07
  • 2016-11-12
  • 1970-01-01
  • 2021-12-17
  • 1970-01-01
  • 1970-01-01
  • 2016-11-28
  • 1970-01-01
相关资源
最近更新 更多