How to return response to calling function in AngularJS?

Question

I am calling this method testDataService, which is defined in the same JS file. This method returns a list which it gets from an API call. I want to set that value to model and return model object. but my return function is getting called before my API returns the response. How can i make sure return function will get called only after the above if block get the data from API.

       getTestData(model) {

            model.name = "practice";
            model.value = 2;

    // this if loop is calling an API and setting up data into model.

           if(this.model.form.length>0 && this.model.form[0].entityName === 'test'){
           let responseList;
           this.testDataService(this.model).then(response => {
           responseList = response;
           model.class = responseList;

    });
    }

           return this.model;

       // this return function is getting called before the api returns its data. How can i make sure this return will get called only after the above if block get the data from API.

    }



    This is method definition

        testDataService(model) {
          let profileType = "test";
          let profileId = "test_profile";
          let configCategory = "test";
          return this.referenceDataService.getTestData(profileType, profileId, configCategory);
        }

Possible duplicate of How do I return the response from an asynchronous call? — 31piy
– 31piy, Commented Jun 1, 2018 at 8:39
you need to return a Promise, which $http service already does. Simple example: return $http.get(url,data).then((res)=>{return res.data;}). So don't return some model, but a Promise instead. Then once you receive it elsewhere, you would need to resolve it with: this.retrieveTestData(this.model).then((res) => {let responseList = res;}) — Aleksey Solovey
– Aleksey Solovey, Commented Jun 1, 2018 at 8:45
what does this function is doing : this.testDataService.getClearingListData(profileType, profileId, configCategory). Code is not very much clear. create a plunker or explain more about your code, — Kusum Kushwaha
– Kusum Kushwaha, Commented Jun 1, 2018 at 8:54
Your function will always return newModel because the call above is async and JS runs on a single thread, therefore it'll continue executing after calling your API. — Protozoid
– Protozoid, Commented Jun 1, 2018 at 9:23

Jay · Accepted Answer · 2018-06-01 11:08:36Z

1

You need to pass return statement from the callback, instead of placing it outside.

getTestData(model) {
  model.name = "practice";
  model.value = 2;

 // this if loop is calling an API and setting up data into model.

 if (this.model.form.length > 0 && this.model.form[0].entityName === 'test') {
    this.testDataService(this.model).then(response => {
        let responseList = response;
        model.class = responseList;
        return this.model;
    }).then(response => {
        return null;
    });
  }
}

testDataService(model) {
 let profileType = "test";
 let profileId = "test_profile";
 let configCategory = "test";
 return this.referenceDataService.getTestData(profileType, profileId, configCategory);
}

edited Jun 1, 2018 at 11:08

answered Jun 1, 2018 at 9:00

Jay

3481 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Protozoid Over a year ago

Nice one, I was gonna suggest exactly the same

Jay Over a year ago

@PriyankaTaneja Updated solution. Hope it will help!

Priyanka Taneja Over a year ago

@Jay Thanks alot

Collectives™ on Stack Overflow

How to return response to calling function in AngularJS?

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related