How to access value outside the .subscribe in angular 2 polling service

Question

// I was trying to get the values from outside the subscribe but it cannot assign to any variable. In my project, get the json content using http.post() method and assigned it to a variable. I want to access these variable value outside the constructor ..How can I make it possible ?

ngOnInit(): void {
    this.getSubscription();
}

// here is my subscription function

getSubscription() {
    interval(5000)
        .pipe(
         startWith(0),
         switchMap(() => this._subscriptionService.getSubData()))
         .subscribe(data => {
             this.Result = data; // able to print the data
             JSON.stringify(this.Result);

             console.log(this.Result); // able to print the data
         });

    console.log(this.Result); // undefined is printing                
}

// I want to access this.result outside the subscribe and assigned to a public variable

Batajus · Accepted Answer · 2018-06-22T09:18:54.330

You're calling the getSubscription() within ngOnInit and at this point of execution your variable Result is not set, because your http request asynchronus. After the first execution of your subscribe-method the variable is set.

If the value is required in other functions I suggest you to call them from within your subscribe, because otherwise you cannot be sure when your http-request is finished.

getSubscription() {
    interval(5000)
        .pipe(
         startWith(0),
         switchMap(() => this._subscriptionService.getSubData()))
         .subscribe(data => {
             this.Result = data; // able to print the data
             JSON.stringify(this.Result);

             console.log(this.Result); // able to print the data

             // Is called every time you get a new result and this.Result is set now
             this.processResults();
     });

    // Not set yet
    console.log(this.Result); // undefined is printing                
}

processResults() {
    // Do some stuff with your results, this.Result is set now
}

I already define Result variable outside the function it wont work like that. can you please provide example?? — Nuwan Bandara, Jun 22 '18 at 09:15

score 0 · Answer 2 · answered Jun 22 '18 at 08:59

define Result outside the function like below

Result:any;

ngOnInit(): void {
       this.getSubscription();
    }

// here is my subscription function

     getSubscription() {
        interval(5000)
        .pipe(
         startWith(0),
         switchMap(() => this._subscriptionService.getSubData()))
         .subscribe(data => {
          this.Result = data; // able to print the data
          JSON.stringify(this.Result);

          console.log(this.Result); // able to print the data
                     });

           console.log(this.Result); // undefined is printing                
          }

I already define Result variable outside the function it wont work like that. can you please provide example?? — Nuwan Bandara, Jun 22 '18 at 09:21

score -1 · Answer 3 · answered Jun 22 '18 at 10:37

-1

It is happening because console.log(this.Result) executes before .subscribe() method finishes it's execution. This can be handled by using async await.

async ngOnInit(): void {
 await this.getSubscription();
}

answered Jun 22 '18 at 10:37

Darshan Bhavsar

169
1
4

Subscriptions are not awaitable, just promises. – ShamPooSham Dec 03 '21 at 11:58

How to access value outside the .subscribe in angular 2 polling service

3 Answers3

Linked