現(xiàn)在我正在開發(fā)一個(gè) Angular 項(xiàng)目，在這個(gè)項(xiàng)目中有一個(gè)包含 2 個(gè)mat-autocomplete組件的頁面，一個(gè)用于選擇國(guó)家/地區(qū)，另一個(gè)用于選擇州/省/自治區(qū)/直轄市。狀態(tài)一工作正常，所有內(nèi)容都停留在預(yù)期位置，如下所示：檢查元素會(huì)顯示有意義的屬性。對(duì)于div類名cdk-overlay-pane（在圖片中突出顯示），widthis350px和top以及l(fā)eft將動(dòng)態(tài)更改以使其始終顯示在關(guān)聯(lián)input元素的正上方或下方。這是相關(guān)的 HTML 代碼：<div class="p-10" fxFlex.gt-md="100" fxFlex.gt-xs="100" fxFlex="100" [hidden]="!showStateDropdown">  <div class="spec-form-field drop-down" matAutocompleteOrigin #stateOrigin="matAutocompleteOrigin">    <mat-form-field>      <input type="text" #stateInput [formControl]="form.controls['state']" placeholder="{{ 'account_section.state' | translate }}" matInput [matAutocomplete]="state" (keyup)="isSelectedState = false; _filterSearch('state');" (blur)="removeUnusableValue();" (focus)="_filterSearch('state');"      [matAutocompleteConnectedTo]="stateOrigin">      <i class="material-icons">arrow_drop_down</i>    </mat-form-field>    <mat-autocomplete #state="matAutocomplete" (optionSelected)="isSelectedState = true;" (blur)="updateAccountData()">      <mat-option *ngFor="let state of states" [value]="state.iso">        {{ state.name }}      </mat-option>    </mat-autocomplete>  </div></div>然而，當(dāng)涉及到mat-autocomplete國(guó)家時(shí)，事情就變得奇怪了。該下拉菜單將始終出現(xiàn)在窗口（瀏覽器）的左上角。當(dāng)我檢查元素時(shí)，width和top的left屬性cdk-overlay-pane始終設(shè)置為0px。