angular - Angular Material Textarea 不要自动对焦

Question

我在模式的底部添加了一个文本区域，并且自动对焦具有滚动到底部的副作用。没有这个自动对焦可以解决这个问题。知道发生了什么。

  <mat-form-field >
      <textarea matTextareaAutosize matInput placeholder="Review Notes" [autofocus]="false" [(ngModel)]="reviewNotes"></textarea>
  </mat-form-field>

"@angular/material": "^6.4.7",

标签： angularangular-material

Answer 1

控制这一点的最佳方法是专门为此目的使用 MatDialog 选项：autoFocus对话框配置中的选项。例如：

constructor(public dialog: MatDialog) {}
...
openDialog(): void {
  this.dialog.open(MyExampleDialog, {
    autoFocus: false
  });
}

这样做的好处是，如果用户在打开对话框后按下 Tab，“第一个可选项卡元素”仍然会获得焦点。使用 tabindex="-1" 将该元素放在焦点链的末尾，使其不太直观。