Angular “角度2材质”对话框：关闭对话框时刷新父对象

我正在使用“angular material 2”对话框将项目添加到列表中。我有一个包含列表（表）的组件（AuthorListComponent）。该组件有一个名为getAuthors的函数，该函数进行rest调用并在模板中呈现表。我还有一个按钮，用于打开“angular material 2”对话框以添加新项目：

我不知道的是，当对话框中的项被保存并且对话框关闭时，我希望AuthorListComponent被刷新，以便新添加的项显示出来。我想我必须在某个地方使用事件发射器来调用getAuthors函数，但是对话框没有使用我可以附加事件的directive/html元素

这是我的模式服务：

import { Observable } from 'rxjs/Rx';
import { AuthorComponent } from '../author/author.component';
import { MdDialogRef, MdDialog, MdDialogConfig } from '@angular/material';
import { Injectable, ViewContainerRef } from '@angular/core';

@Injectable()
export class DialogService {

    constructor(private dialog: MdDialog) { }

    public openDialog(viewContainerRef: ViewContainerRef): Observable<boolean> {
        let dialogRef: MdDialogRef<AuthorComponent>;
        let config = new MdDialogConfig();
        config.viewContainerRef = viewContainerRef;
        config.disableClose = true;
        config.width = '600px';
        dialogRef = this.dialog.open(AuthorComponent, config);
        return dialogRef.afterClosed();
    }
}

因此，我认为我需要从dialog服务或author组件调用上面组件中的getAuthors函数。我想到的另一种方法就是使用router.navigate

---

感谢您的帮助

我明白了。我必须订阅authorlist组件的openDialog函数中的dialog服务

我改变了这一点：

  public openDialog() {
    this.dialogService.openDialog(this.viewContainerRef);
  }

为此：

  public openDialog() {
    this.dialogService
      .openDialog(this.viewContainerRef)
      .subscribe(result => {
             this.getAuthors();
      });
  }

当我使用时，该物业帮助了我：

constructor(public dialog: MdDialog) {
  dialog.afterAllClosed
    .subscribe(() => {
    // update a variable or call a function when the dialog closes
      this.viewMode = 'loadingPage';
      this.getUserData();
    }
  );
 }

openDialog(){
  this.dialog.open(
    DialogComponent
  );
};

---

如果像这样提交成功，您可以传递表单数据

saveAuthor(Author: any) {
    return this.authorService.saveAuthor(Author)
        .then(() => {
            this.dialogRef.close(this.contactForm.value);
        })
        .catch(error => {
            throw ('saveAuthor-component: ' + error);
        });
}

然后您可以将该数据传递到列表，如下所示：

public openDialog() {
this.dialogService.openDialog(this.viewContainerRef);
dialogueref.afterClosed().subscribe((data: any) => {
  if (!data) {
    console.log('failed');
  } else {
    this.authors.unshift(data);
  }}

---

要刷新父级，只需在打开对话框之前添加这行代码：

const dialogConfig = new MatDialogConfig();
this.dialog.afterAllClosed.subscribe(data=> this.myLoadingFunction() )
this.dialog.open(myDialog , dialogConfig);

---

关闭myloadingFunction后立即执行

关闭对话框时刷新父级的最简单方法：

this.dialog.open(DialogComponent)
  .afterClosed()
  .subscribe(() => this.refreshParent());

const dialogConfig = new MatDialogConfig();
this.dialog.afterAllClosed.subscribe(data=> this.myLoadingFunction() )
this.dialog.open(myDialog , dialogConfig);

this.dialog.open(DialogComponent)
  .afterClosed()
  .subscribe(() => this.refreshParent());