在Angular 2中，$ event事件究竟是做什么的？

Question

我有点困惑，这里的$ event究竟是什么，这两个例子有什么区别

<button (click)="clicked($event)"></button>

@Component(...)
class MyComponent {
  clicked(event) {
    event.preventDefault();
  }
}

和

<button (click)="clicked()">Click</button>



 @Component(...)
    class MyComponent {
      clicked(event) {
      }
    }

Answer 1

$event就是事件本身。

事件绑定(someevent)允许绑定到DOM事件和EventEmitter事件。语法完全相同。

对于DOM事件，$event是MouseEvent，KeyboardEvent或您收听的任何事件类型的事件值。

对于EventEmitter个事件，发布的值可用$event

假设此示例$event引用了发出的Ferrari汽车实例：

@Output() carChange:EventEmitter<Car> = new EventEmitter<Car>();

someMethod() {
  this.carChange.emit(new Car({name: 'Ferrari'}));
}

如果您未在$event中使用(click)="clicked()"，则不会传递事件值。

实际上，据我记得，仍然在某些浏览器中传递但不是全部（不记得哪些）

但是如果您使用Angulars WebWorker功能，那么如果您没有明确地列出它，您的方法可能无法获取被触发或发出的事件。

Answer 2

如果您未通过模板中的$event，则表示您的$event方法中的clicked()变量无法使用。

  

请参阅此Plunker以进行快速比较