function is getting called before service execution angular 4

Question

I have one service call which should be done in order to get an array of object.

But before the service call happens the other function is calling.

Which leads to breaking the code.

Is there any way I can subscribe to service and call the other function only if I get a successful response.

I have tried subscribing the service using return and observable but not got any luck

//main call is happeing here

  if (Type === CF) {
     return this.Template(RequestObject,Preference, isProv, tType);
  }

//method call which will return the object after modification

   private Template(RequestObject: RequestObject, Preference: 
  string,
   isProv: boolean, tType: string): DocumentGenerateRequestObject {
  this.tType = this.dataService.getBenefit();

  // For Prov
  if(isProv){
    this.getDocListId('PROV', this.tType);//expecting array of result this.Element here

    this.Element.forEach((type) => {
           if (Preference === BL) {
             if (type.value ==='BLC') {
               RequestObject.masterListID = type.code;
             }
           } });

  }

  // Non Prov
  this.getDocMasterListId('NON_PROV', this.tType); //expecting array of result this.Element here

    this.Element.forEach((type) => {
   this.getDocMasterListId('NON_PROV', this.tType);
      if (Preference === BL) {
        if (type.value ==='BLC_NON') {
          RequestObject.masterListID = type.code;
        }
      }});
  return RequestObject;

}

//service call to get the array

public  getDocListId(category,ttype){


  this.mdaService.getdoc(category,ttype.toUpperCase())
   .subscribe((res) => {
     const docArray = [];
     if (res) {
  res.map(item => {
    docArray.push({code:item.Id, value:item.Type});
  });
   }
this.Element = docArray;
console.log(this.Element);
  },
 (error) => {
 }
);

}

I am expecting the object should update with masterListID but it is not going to the service call and directly throwing Element of undefined.

`public getDocListId(category,ttype){` JavaScript ??? – epascarello Aug 14 '19 at 02:12 — epascarello, Aug 14 '19 at 02:12
It’s angular 4 component – a.p. patel Aug 14 '19 at 02:27 — a.p. patel, Aug 14 '19 at 02:27

score 0 · Answer 1 · answered Aug 14 '19 at 04:39

0

I believe the service is making an HTTP call which is an Asynchronous call. By the time the call gets executed, the HTTP hasn't completed fetching the docArray. Try using async keyword and await for the call to fetch the required data before using the Element property.

answered Aug 14 '19 at 04:39

iams0nus

481
3
8

Can you provide example for this? – a.p. patel Aug 14 '19 at 10:46

function is getting called before service execution angular 4

1 Answers1