Retriving color from JSON API and display this in html file

Ionic Framework ionic-v3
1

Hi, I have a json API with hexadecimal color. I want to to display this in html file. how to do this?

2

provide your little bit a code to understand your situation

3

I think there are many solutions to achieve the behavior you want, try out following:

In your module:

// Declare a modules variable, which will store the value of the retrieved hexcode
protected hexColor: string = null;

// Some function, which will get the hex color from a json api
protected getHexColorFromJSON(): void {

	this.myApiCal().then((data: any) => {

		// Assign the retrieved data to the modules variable
		this.hexColor = data;

	}).catch((error: Error) => {
		console.error(error);
	});
}

Now, after you’ve got your data from your api, you can use the modules variable to work with it in your markup:

<div [ngStyle]="{ 'background-color': this.hexColor }"></div>

Hope it helps.

Cheers
Unkn0wn0x

1 Like