angular2学习笔记之服务和http

发布时间:2019-06-09 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了angular2学习笔记之服务和http脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

现在应用开发多为spa的前后分离,前后端通讯则使用http的接口通过json进行交互。angular2-demo

angular2学习笔记之服务和http

一、 效果图

1. 展现出来的效果

angular2学习笔记之服务和http

2. MySQL的数据

angular2学习笔记之服务和http

二、代码实例

1. 服务 service

import {Injectable} from '@angular/core';
import { Http }from '@angular/http';
import * as api from './../api/Api';
import {Observable} from 'rxjs/Rx';

@Injectable()
export class UserService {
    data:any;

    constructor(public http:Http) {
        this.http = http;
    }

    findAll():Observable<any> {
        return this.http.get(api.findAll).map((res:any)=> {
            return res.json();
        });
    }
}

2.组件 HttpService