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的更多相关文章

  1. Angular 小试牛刀[2]:CI(travie+firebase)

    持续集成(Continuous Integration)是一种软件开发实践,即团队开发成员经常集成它们的工作,通过每个成员每天至少集成一次,也就意味着每天可能会发生多次集成.每次集成都通过自动化的构建 ...

  2. [Firebase] 4. Firebase Object related Database

    The idea: This post we are going to learn how to build a Firebase Forage with object related databas ...

  3. [Firebase] 3. Firebase Simple Login Form

    Using $firebaseSimpleLogin service. Here we use three methods for login, logout, register and getCur ...

  4. 二识angularJS

    前言:记得三月份时下定决心说每天要更新一篇博客,学习点新东西,实践下来发现太不现实,生活中的事情很多,再喜欢也不能让它一件占据生活的全部吧,所以呢,以后顺其自然吧.之前有一篇'初识angular'因为 ...

  5. [AngularFire] Angular File Uploads to Firebase Storage with Angular control value accessor

    The upload class will be used in the service layer. Notice it has a constructor for file attribute, ...

  6. [Angular] Setup automated deployment with Angular, Travis and Firebase

    Automate all the things!! Automation is crucial for increasing the quality and productivity. In this ...

  7. Firebase 相关

    谷歌在 2016年 I/O 大会上推出了 Firebase 的新版本.Firebase 平台提供了为移动端(iOS和Android)和 Web 端创建后端架构的完整解决方案. 从一开始的移动后端即服务 ...

  8. 都 9012了,该选择 Angular、React,还是Vue?

    转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 尽管 Web开发的典型应用场景除了将服务器用作平台.浏览器用作客户端之外,几乎很少活跃于其他业务领域,但不可 ...

  9. [Firebase] 2. Firebase Event Handling

    /** * Created by Answer1215 on 11/9/2014. */ var app = angular.module('app', ['firebase']); app.cons ...

随机推荐

  1. java_log_01

    logback&slf4j(本文中的版本为logback1.1.7.slf4j1.7.21),参照 原作者:Ceki Gülcü.Sébastien Pennec中文版译者:陈华联系方式:cl ...

  2. python challenge 16

    前情回顾:上一篇 第16关地址 打开16关,又是一张奇奇怪怪很多点点的图片,应该又是与PIL库有关的. 页面的标题是:let me get this straight.这是英语中的一句俚语,意思是让我 ...

  3. 【USACO 1.2.5】双重回文数

    [题目描述] 如果一个数从左往右读和从右往左读都是一样,那么这个数就叫做“回文数”.例如,12321就是一个回文数,而77778就不是.当然,回文数的首和尾都应是非零的,因此0220就不是回文数. 事 ...

  4. CentOS 6.5下安装MySql 5.7

    不管您按下面的方法安装成功否,请留个言,把您遇到的问题写上共勉! 包下载http://url.cn/WrNg5S 环境: 1).软硬件:E6420双核CPU,8G内存,1T硬盘 2).虚拟机下 Cen ...

  5. webservice取文件修改时间,返回1601/1/1 8:00:00

    若文件查找不到,则会返回1601/1/1 8:00:00,若能正确查找到该文件,则返回正确的修改时间.

  6. js 遇到 Permission denied to access property ***

    在开发过程 子页面刷新父页面时,中遇到的 Permission denied to access property *** 问题,处理如下: 这是一个跨域的问题,其实很简单 就是子页面所在域名不在父页 ...

  7. python运维开发之第八天(socket)

    什么是 Socket? Socket又称"套接字",应用程序通常通过"套接字"向网络发出请求或者应答网络请求,使主机间或者一台计算机上的进程间可以通讯. soc ...

  8. Testlink接口使用方法-python语言远程调用

    deepin@deepin-pc:~/test$ cat libclienttestlink.py #!/usr/bin/env python3 # -*- coding: utf-8 -*- #! ...

  9. 【新手--android日记】实现IOS风格电话界面

    [前言--新手日记] 开始学习android开发,通过做一个通讯录练习,打算实现各种自己想实现的功能. 新手作品,技术含量很浅.主要是记录自己的学习过程. 纯学习之用,求评论,求建议,求教导. [正题 ...

  10. JavaScript语言内置对象

    String(字符串对象)RegExp(正则表达式对象)Number(数字对象)Math(数学对象)Function(函数对象)Error(异常对象)Date(日期/时间对象)Boolean(布尔对象 ...