Блог

Я использую диалоговое окно угловой материал (v7), у нас есть редактируемые ячейки в диалоговом окне и на странице ниже, а также у нас есть редактируемые ячейки, такие как область текста/ввод текста.

Когда откроется диалоговое окно, если я нажму ctrl z, а затем отменю операцию, работающую как в диалоговом окне, так и на фоновой странице

Как отключить все элементы управления (например, ctrl z) на фоновой странице при открытии диалогового окна.

для получения живого примера проблемы, пожалуйста, ознакомьтесь с последним примером на следующей странице https://material.angular.io/components/dialog/examples

Проведя некоторое исследование, я обнаружил, что это поведение по умолчанию для входных данных HTML,

Если вы отмените последний ввод здесь дважды, то предыдущий ввод автоматически получит фокус.

Один из способов решить эту проблему-внести все предыдущие данные readonly

 openDialog(): void {
  this.readonly = true;
  const dialogRef = this.dialog.open(DialogOverviewExampleDialog);

  dialogRef.afterClosed().subscribe((result) => {
    this.readonly = false;
  });
}
 

 <mat-form-field>
  <input
    matInput
    [(ngModel)]="name"
    placeholder="What's your name?"
    [readonly]="readonly"
  />
</mat-form-field>
 

Пример Стекблитца Здесь