Angular – Ako nahrať JSON dáta – fetch()

Angular

A je tu ďalší článok zameraný na nahrávanie JSON dát vo frameworku Angular. Tentoraz použijem JavaScript funkciu fetch().

Nahrávanie budem demonštrovať na komponente, kde použijem funkciu fetch() v metóde ngOnInit().

Obsah súboru component.ts.

import {Component, OnInit} from '@angular/core';
@Component({
	selector: 'app-fetch',
	templateUrl: './fetch.component.html',
	styleUrls: ['./fetch.component.css']
})
export class FetchComponent implements OnInit {
	jsonData: any[] = [];
	constructor() {}
	ngOnInit(): void {
		fetch('assets/data/mockup.json')
			.then(response => response.json())
			.then(data => {
				this.jsonData = data;
				console.log(data);
			});
	}
}

Nahraté JSON dáta môžeme zobraziť v template nasledovne.

Obsah súboru component.html.

{{ jsonData | json }}
https://www.mldgroup.com

Vyštudovaný top manažér pôsobiaci najmä ako manažér, marketér, softvérový inžinier, konzultant, bloger, YouTuber a zatiaľ neúspešný hudobník a producent. V rámci praxe pôsobil v rôznych odvetviach na rôznych pozíciách v malých aj veľkých firmách, vrátane spoluprác a partnerstiev s významnými firmami či poradenskými spoločnosťami.

Pridaj komentár

Vaša e-mailová adresa nebude zverejnená. Vyžadované polia sú označené *