css - 如何在 Angular 8 中更改 Angular Material 占位符的位置？

Question

我有一个 angular8 元素，其中有 angular material。我正在使用 mat-autocomplete 进行输入自动完成。这是我的html代码

<form class="example-form">
  <mat-form-field class="example-full-width dummy-input-field" floatLabel="never">
    <input matInput class="custom-input" placeholder="State"  [matAutocomplete]="auto" [formControl]="stateCtrl">
  </mat-form-field>
  <mat-autocomplete #auto="matAutocomplete">
      <mat-option *ngFor="let state of filteredStates | async" [value]="state.name">
        <img class="example-option-img" aria-hidden [src]="state.flag" height="25">
        <span>{{state.name}}</span> |
        <small>Population: {{state.population}}</small>
      </mat-option>
    </mat-autocomplete>
</form>

这是我的完整 Stackblitz Link来证明我的问题。输入中有一个占位符，上面写着“状态”。我想将此 placeholder 放置在输入的垂直中间，就像 Html 的普通输入框一样。

如何更改 angular material 输入占位符的位置？

Answer 1

试试这个

stack blitz working Demo

休闲 Angular Material 首字母 steps并导入所需的依赖项

希望对你有帮助