zoukankan      html  css  js  c++  java
  • angular5 httpclient的示例实战

    摘要: 从angular 4.3.0 以后的版本开始使用httpclient,替换了之前的http,引用的包路径已经变为了angular/common/http了

    一个基础的 httpclient 样例

    import { Injectable } from '@angular/core';
    import { HttpClient, HttpResponse } from '@angular/common/http';
    import { Observable } from 'rxjs/Observable';
    import { HttpDefaultOptions } from './http.default.options';
    
    @Injectable()
    export class Service {
    
      private static METHOD_DELTE = 'DELETE';
      private static METHOD_POST = 'POST';
      private static METHOD_GET = 'GET';
      private static METHOD_PUT = 'PUT';
    
      constructor(private httpClient: HttpClient) {
      }
    
      /**
       * 将数据上传
       * @param data
       * @param {Function} func
       */
      uploadDataPost(data: any, func: Function) {
        let url = '/api/test';
        this.apiPost(url, data)
          .subscribe((response: HttpResponse) => {
            func(response);
          }, error => {
            func(undefined);
          });
      }
    
      /**
       * 返回json 格式的obj 对象
       * @param url
       * @param body
       * @param urlSearchParams
       * @returns {Observable<{}>}
       */
      apiPost(url, body, urlSearchParams?: any): Observable<{}> {
        let options = {
          body: body ? body : null,
          params: urlSearchParams,
          responseType: 'json'
        };
        return this.httpClient.request(Service.METHOD_POST, url, options);
      }
    
      /**
       * 返回一个obj 对象
       * @param url
       * @param urlSearchParams url 的查询参数
       * @returns {Observable<{}>}
       */
      apiGet(url, urlSearchParams?: any): Observable<{}> {
        let options = {
          params: urlSearchParams,
          responseType: 'json'
        };
        return this.httpClient.request(Service.METHOD_GET, url, options);
      }
    
    }
  • 相关阅读:
    Vue2.0的变化(2)———vue2.0动画的变化、vue-2.0路由的变化
    Vue2.0的变化(1)——vue2.0组件定义/生命周期/循环/自定义键盘/过滤器/组件通信的变化
    YK-iSystem后台管理系统介绍
    通过docker,部署SpringCloud项目
    Quarz框架学习
    安装CentOS6.9虚拟机
    消息中间件JMS(三)
    消息中间件JMS(二)
    消息中间件JMS(一)
    网页静态化技术Freemarker
  • 原文地址:https://www.cnblogs.com/weiguoaa/p/9134995.html
Copyright © 2011-2022 走看看