Angular 2 View will not update after variable change in subscribe

Question

I have a problem where my view will not change when I update my variable in my observable subscription. I am trying to show a loading spinner while I wait for a response fro

Answer 1

are you seeing any error on console? This could be due to fact that angular is not running change detection after you have made updates to value. I think you don't need ngZone.run as it will run code outside the angular zone.

this.questionService.onSubmit(form, this.questions).subscribe( (value) => {
            this.fileLocation = JSON.stringify(value);
            console.log(this.fileLocation);
            this.isRequesting = "false";
            console.log(this.isRequesting);
    });

If due to some reason you need to run this outside Angular zone, then you should inform angular to run a change detection cycle by either of this method.

• just wrap update of isRequesting in set timeout

  setTimeout( () => this.isRequesting = "false", 0);
  

• invoking change detection manually

  import {ChangeDetectorRef} from '@angular/core'
  constructor(private ref: ChangeDetectorRef){}
  
  this.questionService.onSubmit(form, this.questions).subscribe( (value)=> {
      //existing code
      console.log(this.isRequesting);
      this.ref.detectChanges();
  });