Angular 如何在ngx modal发出post请求后更新组件中的值

我有Clints模式组件，它将数据发布到后端并返回新的客户端

submitForm() {

const body = this.clients;

return this.http.post('api/clients', body).subscribe(data => {

});

}

我有另一个名为ClientsComponent的组件，它有所有客户端的详细信息

ngOnInit() {

if (window.screen.width === 425) { // 425px portrait
  this.gbSearch = true;
}

this.http.get('/api/clients').subscribe(data => {
  this.clients = data;
});
}

---

那么，如何使用从客户机模式组件中的post方法返回的数据更新clientsComponent中的客户机变量呢

submitForm() {

    const body = this.clients;

    return this.http.post('api/clients', body).subscribe(data => {
        // if success call this 
        this.getClient();
    });
}


ngOnInit() {

    if (window.screen.width === 425) { // 425px portrait
        this.gbSearch = true;
    }
    this.getClient();

}

getClient() {
    this.http.get('/api/clients').subscribe(data => {
        this.clients = data;
    });
}

---

如果我很了解您，您需要将事件从客户机模式传递到客户机组件

好吧，我认为解决这个问题的方法不止一个：

如果模态组件是clients组件的子组件，那么您应该使用@output，如下所示：

在模态组件中：

 private @Output() updateClients = new EventEmitter();
 submitForm() {

   const body = this.clients;

   return this.http.post('api/clients', body).subscribe(data => {
      this.updateClients.emit(data);
   });
 }

在客户端组件html中：

<clients-modal (updateClients)="onUpdateClients($event)"></clients-modal>

如果没有父子关系，则应使用sharedService。请阅读以下链接：

---

关于如何做到这一点，有很多信息。。。

private getClients(){
  this.http.get('/api/clients').subscribe(data => {
     this.clients = data;
  });
}

private onUpdateClients(data:any){
    this.getClients();
}