Moj component.ts
import { Component, OnInit } from '@angular/core';
import { ProgrammeService } from '../programme.service';
import { Time } from '@angular/common';
@Component({
selector: 'app-repertuar',
templateUrl: './repertuar.component.html',
styleUrls: ['./repertuar.component.css']
})
export class RepertuarComponent implements OnInit {
filmy: CinemaProgramme[];
film: ProgrammeItems[];
getCinemaProgramme(): void {
this.programmeService.getCinemaProgramme().
subscribe(filmy => this.filmy = filmy);
}
constructor(private programmeService: ProgrammeService) { }
ngOnInit() {
this.getCinemaProgramme();
}
}
export interface Programme {
id: number;
name: string;
cinemaProgramme: CinemaProgramme;
}
export interface CinemaProgramme {
id: number;
programmeItems: Array<ProgrammeItems> ;
}
export interface ProgrammeItems {
movie: Movie;
hours: Date[];
}
export interface Movie {
id: number;
title: string;
director: string;
length: Time;
description: string;
}
Service
import { Injectable } from '@angular/core';
import { of, Observable } from 'rxjs';
import { Programme, ProgrammeItems, CinemaProgramme } from './repertuar/repertuar.component';
import { HttpClient } from '@angular/common/http';
@Injectable({
providedIn: 'root'
})
export class ProgrammeService {
private url = 'http://localhost:8080/programme/getAll';
getCinemaProgramme(): Observable<CinemaProgramme[]> {
return this.http.get<CinemaProgramme[]>(this.url);
}
constructor(private http: HttpClient) { }
}
HTML
<p>repertuar works!</p>
<div *ngFor="let film of filmy " style="width: 130%; margin-left:70px ;">
<div class="one-repertuar">
<h1>{{ film.id }}</h1>
<span *ngFor="let fil of film" style="color:white;">
<h1>{{ fil.movie.description }}</h1>
</span>
Pragne dodać iż interfaces sa dobrze odwzorowane z JSONA ,tylko nwm w czym jest problem co mam zle w kodzie ogolnie w html pierwsze h1 wyswietla mi 7 obietków (1 do 7, bo tyle ogolnie jest) ale przy drugim h1 wyskakuje mi błąd w consolce
ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.