O que faz exactamente o objecto $event em Angular 2?
Estou um pouco confuso o que exatamente $evento está fazendo aqui e qual é a diferença entre estes dois exemplos {[[4]}
<button (click)="clicked($event)"></button>
@Component(...)
class MyComponent {
clicked(event) {
event.preventDefault();
}
}
e
<button (click)="clicked()">Click</button>
@Component(...)
class MyComponent {
clicked(event) {
}
}
2 answers
$event
é o próprio evento.
A ligação ao evento (someevent)
permite ligar-se aos eventos DOM e aos eventos EventEmitter
. A sintaxe é exatamente a mesma.
Para os eventos DOM $event
é a MouseEvent
, KeyboardEvent
, ou o valor do evento do tipo de evento que você ouve.
Para EventEmitter
o valor emitido está disponível como $event
Assumindo que este exemplo $event
se refere à instância do carro emitida Ferrari
:
@Output() carChange:EventEmitter<Car> = new EventEmitter<Car>();
someMethod() {
this.carChange.emit(new Car({name: 'Ferrari'}));
}
Se não utilizar $event
como em (click)="clicked()"
Então o valor do evento não é passado.
Na verdade, tanto quanto me lembro, ainda é passado em alguns navegadores mas não em todos (não me lembro de quais)
Mas se usares a funcionalidade de WebWorker da Angulars, o teu método pode não ter o evento disparado ou emitido se não o listares explicitamente.Se não passar o $event
no seu modelo, então não terá disponível a variável $event
no seu método clicked()
.
Veja este Mergulhador para uma comparação rápida