Child needs to wait for its parent

 avatar
unknown
typescript
2 years ago
2.8 kB
20
Indexable
// Service
class NofiticationsService {
  // ParentComponent Submit Notification
  public parentSubmitSubject: BehaviorSubject<boolean> = new BehaviorSubject(false);
  submitValue = this.parentSubmitSubject.asObservable();

  sendSubmitNotification(data:boolean) {
    this.parentSubmitSubject.next(data);
}
 
 
class ParentComponent implements OnInit, AfterViewChecked {
    
    @ViewChild('submitBtn') submitBtn!: ElementRef<HTMLInputElement>;
    // Is submit Triggered ?
    parentSubmitTriggered:boolean = false;
    // New Goal Observable
    newGoal$!:any;
    // New Goal ID
    newGoalId!:string;
    
    constructor(
        private nofiticationsS: NofiticationsService,
    ) {}
    
    ngOnInit():void {
        // Submit Notification
        this.nofiticationsS.submitValue.subscribe(d => {
          this.parentSubmitTriggered = d;
        });
    }
    
    triggerFormSubmit() {
        this.nofiticationsS.sendSubmitNotification(true);
    }
    
    ngAfterViewChecked(): void {
        if (this.newGoalSubmitTriggered) {
          this.submitBtn.nativeElement.click();
          this.submitNotificationS.sendSubmitNotification(false);
        }
    }
    
    
    onGoalSubmit(form: NgForm) {
      if (form.invalid) {
        return;
      }
      
      this.priorityValue = this.priority.nativeElement.querySelector('.active').innerText;
      this.newGoal = new Goal(
        form.value.name,
        form.value.isMainGoal,
        form.value.details,
        form.value.select_category,
        this.priorityValue,
        form.value.creationDate,
        form.value.endDate
      );
      this.newGoal$ = this.goalsS.postGoal(this.newGoal);
      this.newGoal$.subscribe((response:any) => {});
    
      // ...other stuff here like removing modal 
      // and component refreshing
    }
    

    onTaskSubmit(form:NgForm) {
        this.newTask = new Task(
        this.newGoalId, // This is the place where I need to paste my new Goal ID
        form.value.name,
        form.value.description,
        form.value.priority,
        form.value.taskDate
      );
      this.tasksS.postTask(this.newTask);
    }
  
}

class ChildComponent implements OnInit, AfterViewChecked {
    
    @ViewChild('submitBtn') submitBtn!: ElementRef<HTMLInputElement>;
    @Output() formEvent = new EventEmitter();
    
    // Is submit Triggered ?
    parentSubmitTriggered!:boolean;
    
    constructor(
        private nofiticationsS: NofiticationsService,
    ) {}
    
    ngOnInit():void {
        this.nofiticationsS.submitValue.subscribe(d => {
          this.parentSubmitTriggered = d;
        })
    }


  ngAfterViewChecked(): void {
    if (this.parentSubmitTriggered) {
      this.submitBtn.nativeElement.click();
    }
  }
  
  onSubmit(form:NgForm) {
    this.formEvent.emit(form);
  }
  
}
  
    
    
Editor is loading...