Issue
I am trying Angular2.
I noticed that the http service use Observable
object instead of Promise
(I don't like much that choice.. async
/await
are arriving).
In my service, I download a list of Plants
from the webservice. Clicking on a plant I show the details using the routing.
But in this way when I go back, the plants are downloaded again (because the constructor is called again).
To avoid this I want to do something like:
public getPlants(): Observable<Plants[]>
{
if (this._plants != null)
return Observable.fromResult (this._plants); //This method does not exists
return this._http.get('../../res/heroes.json')...
}
Is there a way to do that?
How can I import the Observable
class in my ts file?
Thanks!
Solution
The method in TypeScript (or JavaScript for that matter) is called of
. Learn rxjs has a nice tutorial as well
If you are using rxjs6 you get everything from rxjs
import { Observable, of } from 'rxjs';
public getPlants(): Observable<Plant[]> {
const mocked: Plant[] = [
{ id: 1, image: 'hello.png' }
];
// returns an Observable that emits one value, mocked; which in this case is an array,
// and then a complete notification
// You can easily just add more arguments to emit a list of values instead
return of(mocked);
}
In previous version you imported the operator of from a different location
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
public getPlants(): Observable<Plant[]> {
const mocked: Plant[] = [
{ id: 1, image: 'hello.png' }
];
return of(mocked);
}
And before that you imported it as an extension for the Observable class
import { Observable } from "rxjs/Observable";
import 'rxjs/add/observable/of';
public getPlants(): Observable<Plants[]> {
// this can be changed to a member variable of course
let mocked: Plants[] = [{
id: 1,
image: "hello.png"
}];
return Observable.of(mocked);
}
Answered By - Patrick
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.