angular4 http RxJS Observable observer

Observable 可观察对象(观察者们), Observer 观察者;

Observable就像快递公司, Observer是快递小哥, 那生产者, 消费者呢? 他们直接喊快递公司就行啦

首先学会 Http 类的用法

1. 组件中 引入 Http

// 引入模块import { Http } from "@angular/http";// 注入@Injectable()export class ApiService {  constructor(public http: Http){}

1. 使用方法, 通过 angular http 返回的就是一个 Observable

this.http      //map 操作符返回一个新的 Observable 对象      .map((r, err) => { return r })      //filter 操作符执行过滤操作，然后又返回一个新的 Observable 对象      .filter(r => r.length >= 2)      // 抖动时间      .debounceTime(1000)      //subscribe 操作符, 启动订阅      .subscribe( //订阅        r => {          // r 接收订阅成功后返回的数据        },        err => {          // 错误时的数据        })      // 错误处理      .catch(err=>{})

好吧, 这个我知道, 怎么自己创建一个呢?

// 创建一个观察者const myserver = (observer) => {  // 返回数据  observer.next('data')  // 返回错误  observer.error()  // 结束  observer.complete()  // 关闭  observer.closed()}// 建立可观察对象 Observableconst obs = new Observable(myserver)// 订阅obs.subscribe(r =>{ console.log(r)})

下面的 myhttp 函数演示了从一个 Get 请求获取 json 并缓存下来的例子,

let mydatamyhttp(): Observable
    
      {  if (mydata) {    // 将缓存的数据 mydata 以 Observable 返回    return new Observable((server: Observer
     
      ) => {      server.next(mydata)      server.complete()    })  } else {    // 通过 Angular Http 获取数据    return this.http.get('data.json')    .map(r => {      // 写入本地 mydata      mydata = r      return r    })  }}