Create a Firebase Servcie:
import {Injectable} from 'angular2/core';
import {Http, Response} from 'angular2/http';
@Injectable()
export class FirebaseService{
constructor(private _http: Http){
}
addOneHistory(keyword: string){
const body = JSON.stringify({keyword: keyword});
return this._http.post('https://xxx.com/searchHistory.json', body)
.map( (res: Response) => {
return res.json();
});
}
getHistories(){
return this._http.get('https://xxxx/searchHistory.json')
.map( (res: Response)=>{
return res.json();
})
.map( (hObj) => {
return Object.keys(hObj)
.map( (key)=>{
return hObj[key];
});
})
}
}
Display the list:
import {Component, OnInit, Input} from 'angular2/core';
import {FirebaseService} from './FirebaseService';
@Component({
selector: 'history',
template: `<ul><li *ngFor="#item of histories | async">
{{item?.keyword}}
</li></ul>`
})
export class HistroyComponent implements OnInit {
histories;
constructor(private _fireBaseService:FirebaseService) {
}
ngOnInit() {
this.histories = this._fireBaseService.getHistories();
}
}