如何在我点击它时将禁用的mat-input设置为启用？

Question

我有一个mat-input默认情况下禁用它来更改文本.如何在点击它时将禁用设置为启用？之后我想在失去焦点时再次变为禁用状态,或者我点击输入.我能这样做吗？

Answer 1

您可以创建一个状态变量,并click在mouseout事件发生时将其分配给输入已禁用的属性

<form class="example-form">
  <mat-form-field class="example-full-width" (click)="disabled=false" (mouseout)="disabled=true">
    <input matInput placeholder="Favorite food" value="Sushi"
          [attr.disabled]="disabled?'':null">
  </mat-form-field>

  <mat-form-field class="example-full-width">
    <textarea matInput placeholder="Leave a comment"></textarea>
  </mat-form-field>
</form>

Answer 2

我用这种方式，在我看来是更好的方式

<input matInput placeholder="Email" [ngModel]="franchise.user_email" formControlName="email" readonly>