class
Use in components with the @Output
directive to emit custom events synchronously or asynchronously, and register handlers for those events by subscribing to an instance.
class EventEmitter<T> extends Subject { constructor(isAsync?: boolean): EventEmitter<T> emit(value?: T): void subscribe(generatorOrNext?: any, error?: any, complete?: any): Subscription }
Creates an instance of this class that can deliver events synchronously or asynchronously. | |||
|
isAsync | boolean | When true, deliver events asynchronously. Optional. Default is |
emit() | |||
---|---|---|---|
Emits an event containing a given value. | |||
|
value | T | The value to emit. Optional. Default is |
void
subscribe() | |||||||||
---|---|---|---|---|---|---|---|---|---|
Registers handlers for events emitted by this instance. | |||||||||
|
generatorOrNext | any | When supplied, a custom handler for emitted events. Optional. Default is |
error | any | When supplied, a custom handler for an error notification from this emitter. Optional. Default is |
complete | any | When supplied, a custom handler for a completion notification from this emitter. Optional. Default is |
Subscription
Extends RxJS Subject
for Angular by adding the emit()
method.
In the following example, a component defines two output properties that create event emitters. When the title is clicked, the emitter emits an open or close event to toggle the current visibility state.
@Component({ selector: 'zippy', template: ` <div class="zippy"> <div (click)="toggle()">Toggle</div> <div [hidden]="!visible"> <ng-content></ng-content> </div> </div>`}) export class Zippy { visible: boolean = true; @Output() open: EventEmitter<any> = new EventEmitter(); @Output() close: EventEmitter<any> = new EventEmitter(); toggle() { this.visible = !this.visible; if (this.visible) { this.open.emit(null); } else { this.close.emit(null); } } }
Access the event object with the $event
argument passed to the output event handler:
<zippy (open)="onOpen($event)" (close)="onClose($event)"></zippy>
© 2010–2020 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v10.angular.io/api/core/EventEmitter