0

I try to communicate between two component one which is dialog.component.ts and the other admin.component.ts with a service between them.

So in my dialog i have a form which triggered the service with the ngsubmit

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

In my dialogService i have :

  private dialogFormContent = new Subject<any>();

  dialogFormContentUpdate$ = this.dialogFormContent.asObservable();

  constructor() {

  }

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

and in my admin.component.ts i have : //Todo a revoir 2 call

 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()
  }

I don't know why the subscription is call two times

  • it's because of your new assignation inside getCollectFormContent(), remove it or for a fast solution just add pipe(take(1)) in your subscription: this.dialogService.dialogFormContentUpdate$.pipe(take(1)).subscribe(...) – Pedro Bezanilla Apr 29 '21 at 11:32
  • I try with and without same problem :( – LikerGotham Apr 29 '21 at 12:04

2 Answers2

0

good morning :D

Probably is this part of code

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

I think that you need to remove the new Subject() like this:

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

Try it :D

Gabriel Sereno
  • 845
  • 1
  • 5
  • 6
0

Another good solution to make data binding between a component and another component in the dialog I already answered here.