首页 > 【请求后台接口】30秒完成Angular10精简版HttpClient请求服务搭建

【请求后台接口】30秒完成Angular10精简版HttpClient请求服务搭建

ng g s services/http

 app.module.ts

...
@NgModule({declarations: [...],imports: [...HttpClientModule,//这个很重紧要，没有就会报错],providers: [],bootstrap: [AppComponent]
})
export class AppModule { }

services/http.service.ts 

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';@Injectable({providedIn: 'root'
})
export class HttpService {private apiUrl = "http://localhost:8888/test/1.json";constructor(private http: HttpClient) { }public getData(params: any) {return this.http.get(this.apiUrl, { params });}public postData(params: any) {return this.http.post(this.apiUrl, { params });}}

 app.component.ts

import { HttpService } from './services/http.service';...constructor(public http: HttpService) { }...ngOnInit() {this.http.getData({ param1: 1, param2: 2 }).subscribe(d => {console.log(d);});this.http.postData({ param1: 1, param2: 2 }).subscribe(d => {console.log(d);});}

最终呈现的效果是

 

更多相关：

  • 在CentOS 6.9 x86_64的nginx 1.12.2上安装第三方模块set-misc-nginx-module实录

    set-misc-nginx-module模块是标准的HttpRewriteModule指令的扩展，提供更多的功能，如URI转义与非转义、JSON引述、Hexadecimal/MD5/SHA1/Base32/Base64编码与解码、随机数等等。在后面的应用中，都将会接触使用到这个模块的。该模块是由章亦春先生开发的，他开发的其他模块应用...

  • 在CentOS 6.3 64bit上安装MySQL for python模块

    该源码包是MySQL-python-1.2.4b4.tar.gz 从2013-06-28以来一直没有更新，注意该网站可以区分访问的终端类型是Windows还是Linux之类的，从而返回的源码包格式不一样。 在CentOS上的安装方法是 http://www.cnblogs.com/jackluo/p/3559978.html...

  • ATS中开启Refer防盗链功能

    ATS默认提供了对Referer头的http request的防盗链功能，主要应用于图片，对视频等会使用级别更高的防盗链功能，比如事先约定好key，采用md5或HMAC-Sha1算法加密等。 在remap.config中按如下格式设置： map_with_referer client-URL origin-server-URL re...

  • 在ATS 5.3.0上测试background_fetch插件

    测试大文件下载 curl -I "http://resource.tsk.erya100.com/TS/flv/TS180/5836/9.flv?t=1430796561727" 单条转发模式in per remap mode 在remap.config中添加一条 map http://resource.tsk.e...

©2024 11GX.COM