refactor(material/select): Remove use of zone onStable to wait for op…

…tions
angular · Feb 27, 2024 · fc30854 · fc30854
1 parent 63a764d
commit fc30854
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 18 deletions.
diff --git a/src/material/select/select.ts b/src/material/select/select.ts
@@ -8,8 +8,8 @@
 
 import {
   ActiveDescendantKeyManager,
-  LiveAnnouncer,
   addAriaReferencedId,
+  LiveAnnouncer,
   removeAriaReferencedId,
 } from '@angular/cdk/a11y';
 import {Directionality} from '@angular/cdk/bidi';
@@ -35,6 +35,7 @@ import {ViewportRuler} from '@angular/cdk/scrolling';
 import {
   AfterContentInit,
   Attribute,
+  booleanAttribute,
   ChangeDetectionStrategy,
   ChangeDetectorRef,
   Component,
@@ -45,9 +46,11 @@ import {
   ElementRef,
   EventEmitter,
   Inject,
+  inject,
   InjectionToken,
   Input,
   NgZone,
+  numberAttribute,
   OnChanges,
   OnDestroy,
   OnInit,
@@ -58,9 +61,6 @@ import {
   SimpleChanges,
   ViewChild,
   ViewEncapsulation,
-  booleanAttribute,
-  inject,
-  numberAttribute,
 } from '@angular/core';
 import {
   AbstractControl,
@@ -71,17 +71,17 @@ import {
   Validators,
 } from '@angular/forms';
 import {
+  _countGroupLabelsBeforeOption,
   _ErrorStateTracker,
+  _getOptionScrollPosition,
   ErrorStateMatcher,
+  MAT_OPTGROUP,
+  MAT_OPTION_PARENT_COMPONENT,
   MatOptgroup,
   MatOption,
   MatOptionSelectionChange,
-  MAT_OPTGROUP,
-  MAT_OPTION_PARENT_COMPONENT,
-  _countGroupLabelsBeforeOption,
-  _getOptionScrollPosition,
 } from '@angular/material/core';
-import {MatFormField, MatFormFieldControl, MAT_FORM_FIELD} from '@angular/material/form-field';
+import {MAT_FORM_FIELD, MatFormField, MatFormFieldControl} from '@angular/material/form-field';
 import {defer, merge, Observable, Subject} from 'rxjs';
 import {
   distinctUntilChanged,
@@ -542,6 +542,8 @@ export class MatSelect
       ? this._defaultOptions.panelWidth
       : 'auto';
 
+  private _initialized = new Subject();
+
   /** Combined stream of all of the child options' change events. */
   readonly optionSelectionChanges: Observable<MatOptionSelectionChange> = defer(() => {
     const options = this.options;
@@ -553,11 +555,8 @@ export class MatSelect
       );
     }
 
-    return this._ngZone.onStable.pipe(
-      take(1),
-      switchMap(() => this.optionSelectionChanges),
-    );
-  }) as Observable<MatOptionSelectionChange>;
+    return this._initialized.pipe(switchMap(() => this.optionSelectionChanges));
+  });
 
   /** Event emitted when the select panel has been toggled. */
   @Output() readonly openedChange: EventEmitter<boolean> = new EventEmitter<boolean>();
@@ -587,7 +586,11 @@ export class MatSelect
   constructor(
     protected _viewportRuler: ViewportRuler,
     protected _changeDetectorRef: ChangeDetectorRef,
-    protected _ngZone: NgZone,
+    /**
+     * @deprecated Unused param, will be removed.
+     * @breaking-change 19.0.0
+     */
+    _unusedNgZone: NgZone,
     defaultErrorStateMatcher: ErrorStateMatcher,
     readonly _elementRef: ElementRef,
     @Optional() private _dir: Directionality,
@@ -650,6 +653,9 @@ export class MatSelect
   }
 
   ngAfterContentInit() {
+    this._initialized.next();
+    this._initialized.complete();
+
     this._initKeyManager();
 
     this._selectionModel.changed.pipe(takeUntil(this._destroy)).subscribe(event => {

diff --git a/tools/public_api_guard/material/select.md b/tools/public_api_guard/material/select.md
@@ -86,7 +86,8 @@ export { MatPrefix }
 
 // @public (undocumented)
 export class MatSelect implements AfterContentInit, OnChanges, OnDestroy, OnInit, DoCheck, ControlValueAccessor, MatFormFieldControl<any> {
-    constructor(_viewportRuler: ViewportRuler, _changeDetectorRef: ChangeDetectorRef, _ngZone: NgZone, defaultErrorStateMatcher: ErrorStateMatcher, _elementRef: ElementRef, _dir: Directionality, parentForm: NgForm, parentFormGroup: FormGroupDirective, _parentFormField: MatFormField, ngControl: NgControl, tabIndex: string, scrollStrategyFactory: any, _liveAnnouncer: LiveAnnouncer, _defaultOptions?: MatSelectConfig | undefined);
+    constructor(_viewportRuler: ViewportRuler, _changeDetectorRef: ChangeDetectorRef,
+    _unusedNgZone: NgZone, defaultErrorStateMatcher: ErrorStateMatcher, _elementRef: ElementRef, _dir: Directionality, parentForm: NgForm, parentFormGroup: FormGroupDirective, _parentFormField: MatFormField, ngControl: NgControl, tabIndex: string, scrollStrategyFactory: any, _liveAnnouncer: LiveAnnouncer, _defaultOptions?: MatSelectConfig | undefined);
     ariaLabel: string;
     ariaLabelledby: string;
     protected _canOpen(): boolean;
@@ -153,8 +154,6 @@ export class MatSelect implements AfterContentInit, OnChanges, OnDestroy, OnInit
     ngOnDestroy(): void;
     // (undocumented)
     ngOnInit(): void;
-    // (undocumented)
-    protected _ngZone: NgZone;
     _onAttached(): void;
     _onBlur(): void;
     _onChange: (value: any) => void;