如何将 mat-form-field 设置为只读？

正如上面的评论所建议的，只需将 .readonly<input>

观看现场演示。

输入概述示例.html

<form class="example-form">
  <mat-form-field class="example-full-width">
    <mat-label>Favorite food</mat-label>
    <input
      matInput
      placeholder="Ex. Pizza"
      value="Sushi"
      [formControl]="foodCtrl"
      readonly
    />
  </mat-form-field>
</form>

input-overview-example.ts

import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';

@Component({
  selector: 'input-overview-example',
  styleUrls: ['input-overview-example.css'],
  templateUrl: 'input-overview-example.html',
})
export class InputOverviewExample implements OnInit {
  foodCtrl: FormControl;
  ngOnInit() {
    this.foodCtrl = new FormControl('');
  }
}