I am offering the following service
@Injectable()
export class LMSVideoResulful {
getVideos( enrolmentId : number ) :Observable<Array<Video>> {
var x = new Array<Video>();
//https://www.youtube.com/embed/MV0vLcY652c
x.push( new Video( "SQL 1", "https://www.youtube.com/embed/qMvDsarDdK0", "sdsdssdss" ));
x.push( new Video( "SQL 2", "https://www.youtube.com/embed/hVBALRtY8g0", "sdsdssdss" ));
x.push( new Video( "SQL 3", "https://www.youtube.com/embed/qMvDsarDdK0", "sssdssds" ));
x.push( new Video( "SQL 4", "https://www.youtube.com/embed/8Fo_KTDrBSU", "sdsdssdss" ));
return from([x]);
}
}
Explaining the video model
export class Video{
constructor(
title : string,
videoUrl: string,
description : string
){}
}
When initializing the component, I call the service like this
constructor( private _sanitizer: DomSanitizer, public myVideoService : LMSVideoResulful ){//https://www.youtube.com/watch?v=cm196HOdSzI
this.safeURL = this._sanitizer.bypassSecurityTrustResourceUrl("https://www.youtube.com/embed/MV0vLcY652c");
this.myVideoService.getVideos(1).subscribe( x => {
this.videoList = x;
console.log(JSON.stringify(x));
}, error => error)
}
Despite four objects being sent through the service, the console.log() line shows an array of four empty objects
https://i.stack.imgur.com/rEQH5.png
What could be causing this issue and how can it be resolved?