1

I am trying to get the second function return value in ngOnInit, but it's giving undefined. If I print SvgImage its printing. I don't know where I did the mistake.

ngOnInit() {
this.userService.displayEvents(this.user_id).subscribe(data => {
  this.eventArray = [];
  if (data.status == 'success') {
    data.result.forEach(obj => {
      let item = {
        id: obj.id,
        user_id: obj.user_id,
        name: obj.name,
        image: this.getSvgImage(obj.category, obj.color_code),
        category: obj.category,
        start_date: obj.start_date,
        status: obj.status,
      };
      this.eventArray.push(item);
    });
    this.displayEvents = this.eventArray;
    console.log(this.displayEvents);
  }
});
}

getSvgImage(categoryID: any, colorCode: any) {
this.userService.getEventCategory().subscribe((data) => {
  let SvgImage: any = "";
  if (data.status == "success") {
    data.result.forEach(obj => {
      if (obj.id == categoryID) {
        let color = colorCode.replace("#", "");
        let SvgImageReplace = obj.image.split('#').pop().split(';')[0];
        SvgImage = obj.image.replace(SvgImageReplace, color);
        SvgImage = this.sanitized.bypassSecurityTrustHtml(SvgImage);
      }
    });
  }
  return SvgImage;
});
}
2
  • Are you sure that SvgImage in getSvgImage function returns undefined or is the image property of item that is undefined because the getEventCategory() has not returned when the item.image gets the value? Commented Feb 13, 2020 at 12:56
  • I am sure, I am printing the SvgImage in the console. It's coming but the same value is not returning from the function. Commented Feb 13, 2020 at 12:57

2 Answers 2

2

Try the following mods:

ngOnInit() {
    this.userService.displayEvents(this.user_id).subscribe(data => {
        this.eventArray = [];
        if (data.status == 'success') {
            data.result.forEach(obj => {
                let item = {
                    id: obj.id,
                    user_id: obj.user_id,
                    name: obj.name,
                    image: '',
                    category: obj.category,
                    start_date: obj.start_date,
                    status: obj.status,
                };
                this.eventArray.push(item);
                this.getSvgImage(item, obj.category, obj.color_code),
            });
            this.displayEvents = this.eventArray;
            console.log(this.displayEvents);
        }
    });
}

getSvgImage(item, categoryID: any, colorCode: any) {
    this.userService.getEventCategory().subscribe((data) => {
        let SvgImage: any = "";
        if (data.status == "success") {
            data.result.forEach(obj => {
                if (obj.id == categoryID) {
                    let color = colorCode.replace("#", "");
                    let SvgImageReplace = obj.image.split('#').pop().split(';')[0];
                    SvgImage = obj.image.replace(SvgImageReplace, color);
                    SvgImage = this.sanitized.bypassSecurityTrustHtml(SvgImage);
                }
            });
        }
        item.image = SvgImage;
    });
}

getSvgImage will get as it's first param the item object and once the subscription completes it will update the image property.

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

Comments

1

The function getSvgImage does not return anything. The invocation this.userService.getEventCategory().subscribe((data) => { ... }) creates a Subscription but you don't event return it.

2 Comments

Yes, It's not returning anything.
Well, do return something then, if that's what you want! :-D

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.