小编Rod*_*edo的帖子

如何使用 mat-dialog 的backgroundClick 关闭对话框并将更改的数据发送回父组件

我有以下场景:我使用 mat-dialog 来显示 *ngFor 卡的信息,在这张卡中,有一些静态信息,例如消息正文、标题和发布者,但我也有动态元素,在本例中是一个“喜欢”按钮。

当有人单击对话框外部的“喜欢”按钮(这是出版物的展开视图)时,“喜欢”按钮会变成红色,并且它的计数器收到它的值+ 1,如果该人再次单击它,它会变成灰色并具有 de 值其中 - 1。

如果有人打开对话框并单击按钮,然后单击关闭按钮,它工作正常,但如果有人单击“喜欢”按钮,然后单击背景或按“esc”,则数据不会发送回父组件。

我的代码如下:

visualize(value: any) { //method that opens the dialog

    if (value.link && !value.video_destaque)
        window.open(value.link, "_blank");
    else {
        const publicationData = { //pass the data to dialog
            id: value.id,
            cabecalho: value.header,
            corpo: value.body,
            ...
            curtiu: value.curtiu,
            classeFavorite: value.classeFavorite,
            num_curtidas: value.num_curtidas,
        };

        const dialogRef = this.dialog.open(VisualizePublicationComponent, { //open dialog
            maxHeight: '85vh',
            width: '70vh',
            panelClass: 'custom-dialog-container',
            disableClose: true,
            data: {
                publicacao: publicationData
            }
        });

        dialogRef.afterClosed().subscribe(result => { 
            this.post.curtiu = result.curtiu;
            this.post.favoritou …
Run Code Online (Sandbox Code Playgroud)

angular-material angular

8
推荐指数
1
解决办法
8219
查看次数

标签 统计

angular ×1

angular-material ×1