@@ -40,7 +40,6 @@ import {
40
40
import { ViewportRuler } from '@angular/cdk/scrolling' ;
41
41
import {
42
42
AfterContentInit ,
43
- AfterViewInit ,
44
43
Attribute ,
45
44
ChangeDetectionStrategy ,
46
45
ChangeDetectorRef ,
@@ -1283,7 +1282,7 @@ export class MatSelectTrigger {}
1283
1282
{ provide : MAT_OPTION_PARENT_COMPONENT , useExisting : MatSelect } ,
1284
1283
] ,
1285
1284
} )
1286
- export class MatSelect extends _MatSelectBase < MatSelectChange > implements OnInit , AfterViewInit {
1285
+ export class MatSelect extends _MatSelectBase < MatSelectChange > implements OnInit {
1287
1286
@ContentChildren ( MatOption , { descendants : true } ) options : QueryList < MatOption > ;
1288
1287
@ContentChildren ( MAT_OPTGROUP , { descendants : true } ) optionGroups : QueryList < MatOptgroup > ;
1289
1288
@ContentChild ( MAT_SELECT_TRIGGER ) customTrigger : MatSelectTrigger ;
@@ -1332,23 +1331,23 @@ export class MatSelect extends _MatSelectBase<MatSelectChange> implements OnInit
1332
1331
. pipe ( takeUntil ( this . _destroy ) )
1333
1332
. subscribe ( ( ) => {
1334
1333
if ( this . panelOpen ) {
1335
- this . _overlayWidth = this . _getOverlayWidth ( ) ;
1334
+ this . _overlayWidth = this . _getOverlayWidth ( this . _preferredOverlayOrigin ) ;
1336
1335
this . _changeDetectorRef . detectChanges ( ) ;
1337
1336
}
1338
1337
} ) ;
1339
1338
}
1340
1339
1341
- ngAfterViewInit ( ) {
1342
- // Note that it's important that we read this in `ngAfterViewInit`, because
1343
- // reading it earlier will cause the form field to return a different element.
1340
+ override open ( ) {
1341
+ // It's important that we read this as late as possible, because doing so earlier will
1342
+ // return a different element since it's based on queries in the form field which may
1343
+ // not have run yet. Also this needs to be assigned before we measure the overlay width.
1344
1344
if ( this . _parentFormField ) {
1345
1345
this . _preferredOverlayOrigin = this . _parentFormField . getConnectedOverlayOrigin ( ) ;
1346
1346
}
1347
- }
1348
1347
1349
- override open ( ) {
1350
- this . _overlayWidth = this . _getOverlayWidth ( ) ;
1348
+ this . _overlayWidth = this . _getOverlayWidth ( this . _preferredOverlayOrigin ) ;
1351
1349
super . open ( ) ;
1350
+
1352
1351
// Required for the MDC form field to pick up when the overlay has been opened.
1353
1352
this . stateChanges . next ( ) ;
1354
1353
}
@@ -1393,12 +1392,14 @@ export class MatSelect extends _MatSelectBase<MatSelectChange> implements OnInit
1393
1392
}
1394
1393
1395
1394
/** Gets how wide the overlay panel should be. */
1396
- private _getOverlayWidth ( ) : string | number {
1395
+ private _getOverlayWidth (
1396
+ preferredOrigin : ElementRef < ElementRef > | CdkOverlayOrigin | undefined ,
1397
+ ) : string | number {
1397
1398
if ( this . panelWidth === 'auto' ) {
1398
1399
const refToMeasure =
1399
- this . _preferredOverlayOrigin instanceof CdkOverlayOrigin
1400
- ? this . _preferredOverlayOrigin . elementRef
1401
- : this . _preferredOverlayOrigin || this . _elementRef ;
1400
+ preferredOrigin instanceof CdkOverlayOrigin
1401
+ ? preferredOrigin . elementRef
1402
+ : preferredOrigin || this . _elementRef ;
1402
1403
return refToMeasure . nativeElement . getBoundingClientRect ( ) . width ;
1403
1404
}
1404
1405
0 commit comments