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

 

posted @ 2016-04-25 04:59  Zhentiw  阅读(238)  评论(0)    收藏  举报