angularrxjsangular2-observablessubscriptions

closing a dialog box automatically after 3 seconds angular 5 observables


I have a subscription that receives a signal upon that signal a boolean to show a dialog box in my html is set to true. I want the dialog box to automatically disappear after 3 seconds.

I am having trouble with the observable I have inside my subscription.

 this.updatedvolleyvar = this.venuevolly.receiveupdated()
      .subscribe(
        (req: any)=>{
          if (req != null){
            let stopcondition = false;
            this.showupdated = true;
            Observable.interval(3000)
              .takeWhile(() => !stopcondition)
                .subscribe(r =>{
                  this.showupdated = false;
                  stopcondition = true;
                });
          }
        }
      );

I believe I am in need of creating an object of type observable and then subscribing to it. I think it is the takeWhile that is throwing me off. What should I do next?


Solution

  • You can follow more easy, and I think, more proper way to close the dialog - use regular setTimeout:

    this.updatedvolleyvar = this.venuevolly.receiveupdated()
      .subscribe((req: any) => {
        if (req != null) {
          let stopcondition = false;
          this.showupdated = true;
          setTimeout(() => {
            this.showupdated = false;
            stopcondition = true;
          }, 3000);
        }
    });
    

    There is no need to complicate your life, simple things are done simply.