SNS项目笔记<四>--RXjs简要用法

/**
     定义全局头部
     1、指定Content-Type 和服务器互相以json交互<RequestBody 为json>
     2、指定ACCESS_TOKEN用于登陆验证
*/
private header = new Headers({
    'Content-Type': 'application/json',
    'ACCESS_TOKEN': this.getToken()
  });

getToken() {
    let token = localStorage.getItem("token");
    return token || ""
  }

//由于rxjs包很大，内容很多，我们取有需要的即可
import 'rxjs/add/operator/map';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch' 
export class BaseServiceProvider{
......
/**
使用自定义头部option
*/
private option = new RequestOptions({heads:this.header})

/**
get请求，注册请求体
url：请求url
ResponseBody: 自定义pojo类
*/
get():Observable<ResponseBody>{
    return this.http.get(url,this.option)
.map(response=>response.json())
.catch(this.handleError)
}

/**
post请求，注册请求体
url：请求url
ResponseBody:自定义pojo类
*/
post(param):Observable<ResponseBody>{
    return this.http.post(url,{'key',param},this.option)
.map(response=>response.json())
.catch(this.handleError)
}


//这里直接使用官方教程的类，处理错误信息
private handleError(error: Response | any) {
    this.dialog.dismiss();
    let errMsg: string;
    if (error instanceof Response) {
      const body = error.json() || '';
      const err = body.error || JSON.stringify(body);
      errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
    } else {
      errMsg = error.message ? error.message : error.toString();
    }
    console.error(errMsg);
    return Observable.throw(errMsg);
  }
......

   /**
     * Performs a request with `get` http method.
     */
    get(url: string, options?: RequestOptionsArgs): Observable<Response>;
    /**
     * Performs a request with `post` http method.
     */
    post(url: string, body: any, options?: RequestOptionsArgs): Observable<Response>;

   //某个需要请求的类里:
   export class RealPage{
    constructor(public navCtrl: NavController, public navParams: NavParams, public baseService:BaseServiceProvider) {
    }
    param:any  //请求携带的参数，这里可以自定义为number、string、boolean、Array类型
    ionViewDidLoad(){
        //建立get请求
        this.baseService.get()
.subscribe(
            data => this.responseData = data, Error => {//请求失败，处理信息}, () => {//请求成功，ResponseData数据处理}
        );
        //建立post请求
        this.baseService.post(this.param)
.subscribe(
            data => this.responseData = data, Error => {//请求失败，处理信息}, () => {//请求成功，ResponseData数据处理}
        );

    }

} 

import { Injectable } from '@angular/core';
import { Subject } from 'rxjs/Subject';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class RxBus{

    private param: any;
    private subject: Subject<any> = new Subject()

    setListener(param: any): void {
        this.param= param;
        this.subject.next(param);
    }

    bus(): Observable<any> {
        return this.subject.asObservable();
    }
}

export class MainPage {
     constructor(public eventsBus:RxBus) {}

     ionViewDidLoad() {
        //注册监听器
        this.eventsBus.bus().subscribe(param=>{
                 //处理param
        })
      }

}  

export class NextPage {
      constructor(public eventsBus:RxBus,public nav:NavController) {}
      
      //回到MainPage页面
      backClick(){
             // 设置回调
             this.eventsBus.setListener("param");
             this.nav.pop();
      }
}