Eu tenho esse componente de diálogo angular que desejo fechar somente após a conclusão da API. Eu tenho o seguinte abaixo, mas a caixa de diálogo não está fechando quando this.matchComplete = true
concluída.
<mat-dialog-actions align="end">
<button mat-button mat-dialog-close color="accent">Cancel</button>
<button
mat-raised-button
[mat-dialog-close]="matchComplete"
cdkFocusInitial
(click)="matchDialog()"
color="accent">Continue</button>
</mat-dialog-actions>
@Component({
selector: 'match-dialog',
templateUrl: 'match-dialog.html',
})
export class MatchDialog {
matchComplete: boolean;
constructor(
@Inject(MAT_DIALOG_DATA) public data: {text: string, foo: object},
private apiService: ApiService,
) {
this.matchComplete = false;
}
matchDialog() {
this.apiService.add()
.subscribe(null, null, () => this.matchComplete = true);
}
}
Acho que você está um pouco confuso sobre como [mat-dialog-close] funciona. Acho que esta pergunta é melhor respondida aqui: Uso de [mat-dialog-close]
A segunda resposta mais alta de Torinthiel fornece uma ótima visão de como mat-dialog-close funciona e como você deseja fechar o componente de diálogo mat.