I'm new to both Angular2 and Rxjs and I am a little confused about a particular case.
I have a simple service:
import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs/Rx';
import { Http, Response } from '@angular/http';
export interface Article {
id: number;
title: string;
content: string;
author: string;
}
@Injectable()
export class ArticleService {
private _articles$: Subject<Article[]>;
private baseUrl: string;
private dataStore: {
articles: Article[]
};
constructor(private http: Http) {
this.baseUrl = 'http://localhost:3000'
this.dataStore = { articles: [] };
this._articles$ = <Subject<Article[]>>new Subject();
}
get articles$(){
return this._articles$.asObservable();
}
loadAll(){
//Observable.from(this.dummyData)
this.http.get(`${this.baseUrl}/articles`)
.map(response => response.json())
.subscribe(data => {
//debugger;
this.dataStore.articles = data;
// Push a new copy of our article list to all Subscribers.
this._articles$.next(this.dataStore.articles)
}, error => console.log('Could not load Articles'));
}
}
And this works as expected , but what I would like to do is to be able to develope my service without a api endpoint and using an Observable that I can later swap out for the http.request
. I tried to do this using Observable.from to convert a dummy data array to an observable but I get the errors
Type '{ id: number; title: string; content: string; author: string; }' is not assignable to type 'Article[]'
I believe this is because it is returning each item separately instead of the array , can someone point me in the correct direction of how this should work
Update: for clarity the dummyData look like:
private dummyData = [
{
id: 1,
title: 'Title 1',
content: 'content 1',
author: 'author 1'
},
{
id:2,
title: 'Title 2',
content: 'content 2',
author: 'author 1'
}
];
this.http
call I would suggest the in-memory-api -npmjs.com/package/angular2-in-memory-web-apithis.http.get('${this.baseUrl}/articles').map(response => response.json())
toObservable.from(this.dummyData)
I get the build error mentioned above i.e.Type '{ id: number; title: string; content: string; author: string; }' is not assignable to type 'Article[]'
_articles$
?