From f59abdb3d5a62d1199a4a2b4bba92e33e38d5e19 Mon Sep 17 00:00:00 2001 From: Austin Date: Mon, 30 Oct 2017 16:31:44 -0500 Subject: [PATCH] fix(select): make @Output names consistent #6677 (#8052) --- src/lib/select/select.spec.ts | 2 +- src/lib/select/select.ts | 45 ++++++++++++++++++++++++++++------- 2 files changed, 37 insertions(+), 10 deletions(-) diff --git a/src/lib/select/select.spec.ts b/src/lib/select/select.spec.ts index f1fbe1ef28dd..6eaa22e7ff63 100644 --- a/src/lib/select/select.spec.ts +++ b/src/lib/select/select.spec.ts @@ -3390,7 +3390,7 @@ class NgIfSelect { selector: 'select-with-change-event', template: ` - + {{ food }} diff --git a/src/lib/select/select.ts b/src/lib/select/select.ts index 9ca633252822..739afb49756c 100644 --- a/src/lib/select/select.ts +++ b/src/lib/select/select.ts @@ -18,7 +18,7 @@ import { ScrollStrategy, ViewportRuler, } from '@angular/cdk/overlay'; -import {filter, first, startWith, takeUntil} from 'rxjs/operators'; +import {filter, first, map, startWith, takeUntil} from 'rxjs/operators'; import { AfterContentInit, Attribute, @@ -401,14 +401,41 @@ export class MatSelect extends _MatSelectMixinBase implements AfterContentInit, return merge(...this.options.map(option => option.onSelectionChange)); } - /** Event emitted when the select has been opened. */ - @Output() onOpen: EventEmitter = new EventEmitter(); + /** Event emitted when the select has been opened. */ + @Output() openedChange: EventEmitter = new EventEmitter(); + + /** Event emitted when the select has been opened. */ + @Output('opened') + get _openedStream(): Observable { + return this.openedChange.pipe(filter(o => o), map(() => {})); + } /** Event emitted when the select has been closed. */ - @Output() onClose: EventEmitter = new EventEmitter(); + @Output('closed') + get _closedStream(): Observable { + return this.openedChange.pipe(filter(o => !o), map(() => {})); + } + + /** + * Event emitted when the select has been opened. + * @deprecated Use `openedChange` instead. + */ + @Output() onOpen: Observable = this._openedStream; - /** Event emitted when the selected value has been changed by the user. */ - @Output() change: EventEmitter = new EventEmitter(); + /** + * Event emitted when the select has been closed. + * @deprecated Use `openedChange` instead. + */ + @Output() onClose: Observable = this._closedStream; + + /** Event emitted when the selected value has been changed by the user. */ + @Output() selectionChange: EventEmitter = new EventEmitter(); + + /** + * Event emitted when the selected value has been changed by the user. + * @deprecated Use `selectionChange` instead. + */ + @Output() change: EventEmitter = this.selectionChange; /** * Event that emits whenever the raw value of the select changes. This is here primarily @@ -637,9 +664,9 @@ export class MatSelect extends _MatSelectMixinBase implements AfterContentInit, _onPanelDone(): void { if (this.panelOpen) { this._scrollTop = 0; - this.onOpen.emit(); + this.openedChange.emit(true); } else { - this.onClose.emit(); + this.openedChange.emit(false); this._panelDoneAnimating = false; this.overlayDir.offsetX = 0; this._changeDetectorRef.markForCheck(); @@ -859,7 +886,7 @@ export class MatSelect extends _MatSelectMixinBase implements AfterContentInit, this._value = valueToEmit; this._onChange(valueToEmit); - this.change.emit(new MatSelectChange(this, valueToEmit)); + this.selectionChange.emit(new MatSelectChange(this, valueToEmit)); this.valueChange.emit(valueToEmit); this._changeDetectorRef.markForCheck(); }