订阅触发两次

时间:2021-04-29 10:40:49

标签: angular service

我尝试在两个组件之间进行通信,一个是 dialog.component.ts,另一个是 admin.component.ts,它们之间有一个服务。

所以在我的对话框中,我有一个表单,它通过 ngsubmit 触发了服务

collectSubmitForm(any) {
    var myObj= new Object({form: any,typeOfForm: this.data.titleDialog});
    this.dialogContentService.getCollectFormContent(myObj);
  }

在我的 dialogService 我有:

  private dialogFormContent = new Subject<any>();

  dialogFormContentUpdate$ = this.dialogFormContent.asObservable();

  constructor() {

  }

  getCollectFormContent(dataAsParams) {
    this.dialogFormContent.next(dataAsParams);
    this.dialogFormContent = new Subject<any>();
  }

在我的 admin.component.ts 中,我有: //Todo revoir 2 调用

 constructor(private dialogService: DialogService) {
    this.collectDataFromDialog();
  }
  collectDataFromDialog() {
    this.subscription = this.dialogService.dialogFormContentUpdate$.subscribe(valueFromFormDialog => {
      if(valueFromFormDialog){
        this.subscriptionValueFromDialog = valueFromFormDialog;
        this.anOtherFunction(this.subscriptionValueFromDialog)
      }
    });
  }

ngOnDestroy() {
    this.subscription.unsubscribe()
  }

不知道为什么订阅会被调用两次

2 个答案:

答案 0 :(得分:0)

早上好:D

大概是这部分代码

  getCollectFormContent(dataAsParams) {
    this.dialogFormContent.next(dataAsParams);
    this.dialogFormContent = new Subject<any>();
  }

我认为您需要像这样删除新的 Subject():

  getCollectFormContent(dataAsParams) {
    this.dialogFormContent.next(dataAsParams);
  }

试试吧:D

答案 1 :(得分:0)

在对话框中的一个组件和另一个组件之间进行数据绑定的另一个很好的解决方案我已经回答了 here