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);
 }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

您可能感兴趣的文章:

  • 详解使用angular的HttpClient搭配rxjs
  • 激动人心的 Angular HttpClient的源码解析
(0)

相关推荐

  • 激动人心的 Angular HttpClient的源码解析

    Angular 4.3.0-rc.0版本已经发布

  • 详解使用angular的HttpClient搭配rxjs

    一.原Http使用总结 使用方法 1.在根模块或核心模块引入HttpModule 即在AppModule或CoreModule中引入HttpModule: import { HttpModule } from '@angular/http'; @NgModule({ import: [ HttpModule ] // ... }) AppModule {} 2.在使用的地方注入Http服务 import { Http } from '@angular/http'; // ... construc

  • 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

  • Java使用HttpClient详细示例

    目录 准备环节 第一步:在pom.xml中引入HttpClient的依赖 第二步:引入fastjson依赖 详细使用示例 GET无参: GET有参(方式一:直接拼接URL): GET有参(方式二:使用URI获得HttpGet): POST无参: POST有参(普通参数): POST有参(对象参数): POST有参(普通参数 + 对象参数): 对评论区关注度较高的问题进行相关补充: 解决响应乱码问题(示例): 进行HTTPS请求并进行(或不进行)证书校验(示例): 相关方法详情(非完美封装): a

  • 详解Angular5 服务端渲染实战

    本文基于上一篇 Angular5 的文章继续进行开发,上文中讲了搭建 Angular5 有道翻译的过程,以及遇到问题的解决方案. 随后改了 UI,从 bootstrap4 改到 angular material,这里不详细讲,服务端渲染也与修改 UI 无关. 看过之前文章的人会发现,文章内容都偏向于服务端渲染,vue 的 nuxt,react 的 next. 在本次改版前也尝试去找类似 nuxt.js 与 next.js 的顶级封装库,可以大大节省时间,但是未果. 最后决定使用从 Angular

  • spring boot封装HttpClient的示例代码

    最近使用到了HttpClient,看了一下官方文档:HttpClient implementations are expected to be thread safe. It is recommended that the same instance of this class is reused for multiple request executions,翻译过来的意思就是:HttpClient的实现是线程安全的,可以重用相同的实例来执行多次请求.遇到这种描述的话,我们就应该想到,需要对H

  • php实现httpclient类示例

    复制代码 代码如下: httpClient::init($httpClient, $args = null);$httpClient->get($url, $data = null, $cookie = null);var_dump($httpClient->buffer); 复制代码 代码如下: <?php class httpClient { public $buffer = null;  // buffer 获取返回的字符串 public $referer = null;  //

  • 史上最全最强SpringMVC详细示例实战教程(图文)

    一.SpringMVC基础入门,创建一个HelloWorld程序 1.首先,导入SpringMVC需要的jar包. 2.添加Web.xml配置文件中关于SpringMVC的配置 <!--configure the setting of springmvcDispatcherServlet and configure the mapping--> <servlet> <servlet-name>springmvc</servlet-name> <serv

  • 浅谈Angular HttpClient简单入门

    现代浏览器支持使用两种不同的 API 发起 HTTP 请求:XMLHttpRequest 接口和 fetch() API. @angular/common/http 中的 HttpClient 类为 Angular 应用程序提供了一个简化的 API 来实现 HTTP 客户端功能. 一.准备工作 首先在app.module.ts 导入 HttpClientModule.如下: import { HttpClientModule } from '@angular/common/http'; @NgM

  • 使用Angular CLI生成 Angular 5项目教程详解

    如果您正在使用angular, 但是没有好好利用angular cli的话, 那么可以看看本文. Angular CLI 官网:https://github.com/angular/angular-cli 安装angular cli: npm install -g @angular/cli 不过首先要确保您安装了比较新版本的nodejs. 今天主要通过以下几个方面介绍Angular CLI: 生成项目 参数介绍 配置和自定义CLI 检查和修复代码 生成新项目: ng new my-app 这个命

  • HttpClient详细使用示例详解

    HttpClient 是Apache Jakarta Common 下的子项目,可以用来提供高效的.最新的.功能丰富的支持 HTTP 协议的客户端编程工具包,并且它支持 HTTP 协议最新的版本和建议. HTTP 协议可能是现在 Internet 上使用得最多.最重要的协议了,越来越多的 Java 应用程序需要直接通过 HTTP 协议来访问网络资源.虽然在 JDK 的 java net包中已经提供了访问 HTTP 协议的基本功能,但是对于大部分应用程序来说,JDK 库本身提供的功能还不够丰富和灵

  • AndroidHttpClient详解及调用示例

    下面给大家展示了AndroidHttpClient结构: public final class AndroidHttpClient extends Object implements HttpClient 前言: 这类其实是Google对阿帕奇的HttpClient的一个封装,一些默认属性有android做了一些优化. 然后阿帕奇的HttpClient是对java中HttpUrlConnection的一个封装,感觉阿帕奇封装的还是不错的, 特别是其中的HttpEntity,很强大也很好用,能在a

随机推荐