Question

我正在尝试构建一个发出自定义事件的组件。我不确定为什么没有触发事件。如果我查看浏览器开发人员工具，我可以看到事件附加到元素。

我甚至尝试创建角度文档提供的小示例：https://angular.io/docs/ts/latest/api/core/Output-var.html但没有运气。

这是小代码：

import {Component} from "angular2/core";
import {Directive} from "angular2/core";
import {Output} from "angular2/core";
import {EventEmitter} from "angular2/core";
import {bootstrap}    from "angular2/platform/browser";

@Directive({
  selector: 'interval-dir',
})
class IntervalDir {
  @Output() everySecond = new EventEmitter();
  @Output('everyFiveSeconds') five5Secs = new EventEmitter();
  constructor() {
    setInterval(() => this.everySecond.emit("event"), 1000);
    setInterval(() => this.five5Secs.emit("event"), 5000);
  }
}
@Component({
  selector: 'app',
  template: `
    <interval-dir (every-second)="everySecond()" (every-five-seconds)="everyFiveSeconds()">
    </interval-dir>
  `,
  directives: [IntervalDir]
})
class App {
  everySecond() { console.log('second'); }
  everyFiveSeconds() { console.log('five seconds'); }
}
bootstrap(App);

不会抛出任何错误，也没有console.log。

注意：我使用的是角度2 - beta0

我错过了什么吗？感谢

Answer 1

不再使用 kebab-case 来处理活动和媒体资源。使用 camelCase ：

@Component({
  selector: 'app',
  template: `
    <interval-dir 
        (everySecond)="everySecond()" 
        (everyFiveSeconds)="everyFiveSeconds()"
    ></interval-dir>
  `,
  directives: [IntervalDir]
})
class App { /* ... */ }

Angular 2 @Output什么都不做

1 个答案: