0

I read articles on how to use NgZone in angular. But still I'm not able to enter subscribe in the first call of execution. Please help me with this. Thanks in advance :)

 constructor(private _apicallservice: ApiCallService, private _ngzone : NgZone) {
  this.someMethod();
})

}

  ngOnInit() {
    this.someMethod();
  }

Method I want to execute:

  getEVforMetric() {
  this._apicallservice.getData("report/getmetricIsEVdata").subscribe(data => {
    console.log("EV values returned from API");
    this.isSchVarByReleaseDate = data[0].Value;
    this.isCostVarianceByEv = data[1].Value;
  })
}

I have a service which gets the data from API. Data is getting returned from API but subscribe is not working in the first call and I'm getting both values as undefined. I understood it is because of Asynchronous call in Angular so I wrapped my method inside NgZone like this but nothing seems to work out.

     someMethod() {
      this._ngzone.run(() => this.getEVforMetric())
     }

I did console.log for both the values but they are coming as undefined in the first call but after some other method executions data is subscribed. I want these values to get updated in the first call itself. I'm a beginner in Angular please help out :)

getData() Method:

getData(url: string){
    let pagedata: any;
    var data = JSON.parse(this._clientcacheservice.getPageCache(PageDataEnum.userInfo));
    let jsonObj: any = data.defaultfilter;
    jsonObj.userId = data.userid;
    let Url = environment.apiUrl + '/api/' + url ;
    pagedata = this.post(Url, jsonObj);
    return pagedata;
}
Nikhil Sharma
  • 1
  • 3
  • What do you mean by 'subscribe is not working in the first call'? – Ritesh Waghela Jul 31 '20 at 07:48
  • @Ritesh i mean , when i call the service, for the first time it is not subscribing to the data instead it comes out of the method. After other method execution it comes back and subscribes to the data. – Nikhil Sharma Jul 31 '20 at 07:51
  • if you are getting values as undefined it means it is subscribing however data returned by the observable is undefined. So I think the problem is not in this code. It is your service getData function which seems to be issue. Can you share code of getData? – Ritesh Waghela Jul 31 '20 at 07:56
  • I'm printing values outside of subscribe and in the code above i did console.log , it is not getting executed. So it means data itself is not getting subscribed. Here is my getData method getData(url: string){ let pagedata: any; var data = JSON.parse(this._clientcacheservice.getPageCache(PageDataEnum.userInfo)); let jsonObj: any = data.defaultfilter; jsonObj.userId = data.userid; let Url = environment.apiUrl + '/api/' + url ; pagedata = this.post(Url, jsonObj); return pagedata; } – Nikhil Sharma Jul 31 '20 at 08:11
  • @Ritesh - I'm trying to add code here but it is not displaying properly. Other methods are also calling getData method but it is working fine. I'm pretty sure sure there is nothing wrong with getData method. – Nikhil Sharma Jul 31 '20 at 08:22
  • ok, from where are you calling this.getEVforMetric()?, if possible paste the code? I see your getData which does a post call. – Ritesh Waghela Jul 31 '20 at 08:28
  • I placed `someMethod()` inside constructor body and ngOnInit() body and inside that method only I'm calling `this.getEVforMetric`. – Nikhil Sharma Jul 31 '20 at 08:40
  • @Ritesh - I've edited in description for your reference. – Nikhil Sharma Jul 31 '20 at 08:58
  • I personally feel there is no need to use NgZone here at all. Try putting the API call directly in ngOnInit. this._apicallservice.getData("report/getmetricIsEVdata").subscribe(data => { console.log("EV values returned from API"); this.isSchVarByReleaseDate = data[0].Value; this.isCostVarianceByEv = data[1].Value; }) – Ritesh Waghela Jul 31 '20 at 09:08
  • @Ritesh - earlier I used that approach only, after that I went to use this NgZone approach. Nothing seems to work at all. – Nikhil Sharma Jul 31 '20 at 09:41

1 Answers1

0

Your get data method is not returning any observable Kindly update it

getData(url: string){
        let pagedata: any;
        var data = JSON.parse(this._clientcacheservice.getPageCache(PageDataEnum.userInfo));
        let jsonObj: any = data.defaultfilter;
        jsonObj.userId = data.userid;
        let Url = environment.apiUrl + '/api/' + url ;
        pagedata = this.post(Url, jsonObj);
    return new Observable<string>(observer => {
pagedata.subscribe(response=>{
    observer.next(response);
})
     
      });
        
    }
Rahul Cv
  • 725
  • 5
  • 12
  • Thanks , It's going inside subscribe now but I need to bind those values from API to my variables. Any suggestions how to do that ? – Nikhil Sharma Jul 31 '20 at 10:15
  • I need to use these variables in my code to check some functionality but I'm struggling to achieve so. Usually, if I don't return observable like what you have mentioned , after subscribing data will come as how i send from API. Only problem being variables will get updated after other method calls. I find your approach good but I'm getting exception `Cannot read property 'Value' of undefined` . A help would be very much appreciated :) – Nikhil Sharma Jul 31 '20 at 14:32
  • Ssure Nikhil , Can. u Recreate the issue in https://stackblitz.com/ so that i can fix it over there – Rahul Cv Jul 31 '20 at 14:39
  • It would be very time consuming for me as I'm quite running short of time. Could you just explain how would you extract those values from the Observable. I'm sending data from API in this form `[ { "Key": "Schedule Variance", "Value": true }, { "Key": "Cost Variance", "Value": false } ]` Earlier data would come in this form on subscribe , now I'm getting observable directly, so finding it difficult to extract these values. – Nikhil Sharma Jul 31 '20 at 14:53
  • HI Nikhil Updated the answer added pagedata.subscribe(response=>{ observer.next(response); }) – Rahul Cv Aug 01 '20 at 04:38
  • I tried as you mentioned , again it won't go inside subscribe. Man , i really don't understand why it is happening like this. After this , I tried subscribing data again in my `getEVforMetric()` method. Again it won't go inside subscribe. – Nikhil Sharma Aug 01 '20 at 07:46