Диалог в Angular без компонента

Question

Есть ли в Angular 8 способ создать небольшой диалог без необходимости создания нового компонента? Небольшое сообщение типа «Операция завершена», которое не требует большого взаимодействия с пользователем. Я просто чувствую, что иметь еще 4 файла в проекте просто для отображения сообщения об успехе было бы слишком много:

small-dialog.component.html
small-dialog.component.scss
small-dialog.component.spec.ts
small-dialog.component.ts

Или, может быть, есть способ создать «компонент по умолчанию» в несколько строк без необходимости создать новый компонент?

Answer 1

Если вы не хотите создавать компонент для самого диалога, вы можете сделать что-то вроде этого:

Просмотр. html

<button (click)="openDialog(template)">Open my dialog</button>
<ng-template #template>
 <h1>This is a message</h1>
</ng-template>

Component.ts

import {MatDialog, MatDialogRef} from '@angular/material/dialog';


constructor(dialog: MatDialog) {}

openDialog(templateRef) {
  let dialogRef = this.dialog.open(templateRef, {
   width: '300px'
 });
}

Здесь также является одним примером того, как вы можете сделать то же самое.

Но я предлагаю вам создать универсальный c компонент диалога, который вы можете использовать в течение всего Приложение, с чего начать, вы можете увидеть его здесь .