Angular – Ako nahrať JSON dáta – 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 }}

• Share on Facebook