[Angular 2] Get start with Firebase

標籤：

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();    }}

 

[Angular 2] Get start with Firebase