Angular 中的数据交互(get jsonp post)
Angular get 请求数据
Angular5.x 以后 get、post 和和服务器交互使用的是 HttpClientModule 模块。

import {HttpClientModule} from '@angular/common/http';

2、在用到的地方引入 HttpClient 并在构造函数声明
import {HttpClient} from "@angular/common/http";
constructor(public http:HttpClient) { }
3、get 请求数据

var api = "http://a.itying.com/api/productlist";
this.http.get(api).subscribe(response => {
console.log(response);
});
Angular post 提交数据
Angular5.x 以后 get、post 和和服务器交互使用的是 HttpClientModule 模块。
1、在 app.module.ts 中引入 HttpClientModule 并注入
import {HttpClientModule} from '@angular/common/http';


2、在用到的地方引入 HttpClient、HttpHeaders 并在构造函数声明 HttpClient

import {HttpClient,HttpHeaders} from "@angular/common/http";

constructor(public http:HttpClient) { }
3、post 提交数据

const httpOptions = {
headers: new HttpHeaders({ 'Content-Type': 'application/json' })
};
var api = "http://127.0.0.1:3000/doLogin";
this.http.post(api,{username:'张三',age:'20'},httpOptions).subscribe(response => {
console.log(response);
});
Angular Jsonp 请求数据
1、在 app.module.ts 中引入 HttpClientModule、HttpClientJsonpModule 并注入

import {HttpClientModule,HttpClientJsonpModule} from '@angular/common/http';

2、在用到的地方引入 HttpClient 并在构造函数声明
import {HttpClient} from "@angular/common/http";


constructor(public http:HttpClient) { }
3、jsonp 请求数据
var api = "http://a.itying.com/api/productlist";
this.http.jsonp(api,'callback').subscribe(response => {
console.log(response);
});

Angular 中的数据交互(get jsonp post)的更多相关文章
- Angular 中的数据交互(get jsonp post)
一.Angular get 请求数据 Angular5.x 以后 get.post 和和服务器交互使用的是 HttpClientModule 模块. 1.在 app.module.ts 中引入 并注入 ...
- hibernate中mysql数据交互中文乱码问题
来源于"http://www.cnblogs.com/jiafuwei/p/4423101.html"; 修改hibernate的配置文件hibernate.cfg.xml,在配置 ...
- vue中的数据监听以及数据交互
现在我们来看一下vue中的数据监听事件$watch, js代码: new Vue({ el:"#div", data:{ arr:[,,] } }).$watch("ar ...
- Struts2基本使用(三)--数据交互
Struts2中的数据交互 在Struts2中我们不必再使用request.getParameter()这种方式来获取前台发送到服务器的参数. 我们可以在服务器端的Java类中直接声明一个和前台发送数 ...
- 【原创】xenomai内核解析--xenomai与普通linux进程之间通讯XDDP(三)--实时与非实时数据交互
版权声明:本文为本文为博主原创文章,转载请注明出处.如有问题,欢迎指正.博客地址:https://www.cnblogs.com/wsg1100/ 目录 1.概述 1.概述 [原创]实时IPC概述 [ ...
- Angular - - $resource 更高端的数据交互
$resource 创建一个resource对象的工厂函数,可以让你安全的和RESFUL服务端进行数据交互. 需要注入 ngResource 模块.angular-resource[.min].js ...
- Angular中的jsonp
1.一般我们使用Angualr中的jsonp值这样使用的:注入$http服务 这样使用jsonp的方式可以支持多数api,但是douban不支持无法使用 module.controller('InTh ...
- angularJs中自定义directive的数据交互
首先放官方文档地址:https://docs.angularjs.org/guide/directive 就我对directive的粗浅理解,它一般用于独立Dom元素的封装,应用场合为控件重用和逻辑模 ...
- get,post,jsonp数据交互—百度下拉列表
三种数据交互形式:get post jsonp 一.get请求 1.引入 vue.js 和 vue-resource.js , 准备一个按钮 <input type="button& ...
随机推荐
- BringWindowToTop完美激活窗口与置顶
void ActiveWin(IntPtr h) { IntPtr hForeWnd = GetForegroundWindow();//获取当前窗口句柄 int tIdCur = GetWindow ...
- Python全栈-magedu-2018-笔记4
第三章 - Python 内置数据结构 元组tuple 一个有序的元素组成的集合 使用小括号 ( ) 表示 元组是不可变对象 元组的定义 初始化 定义 tuple() -> empty tupl ...
- cve-2018-4878漏洞复现
CVE-2018-4878Flash 0day漏洞1.漏洞概述2018年2月1号,Adobe官方发布安全通报(APSA18-01),声明Adobe Flash 28.0.0.137及其之前的版本,存在 ...
- 工作中对git使用的总结
git与svn的区别,简单的说, svn在checkout后,如果不提交,那么版本库没有记录,如果修改的文件比较多,中间想回退几个文件,非常麻烦.git 是clone下来代码和记录,不提交 ...
- vue 父组件给子组件传值,子组件给父组件传值
父组件如何给子组件传值 使用props 举个例子: 子组件:fromTest.vue,父组件 app.vue fromTest.vue <template> <h2>{{tit ...
- Spark入门到精通--(第七节)环境搭建(服务器搭建)
Spark搭建集群比较繁琐,需要的内容比较多,这里主要从Centos.Hadoop.Hive.ZooKeeper.kafka的服务器环境搭建开始讲.其中Centos的搭建不具体说了,主要讲下集群的配置 ...
- asp.net core 使用NLog记录日志到txt文件
一.使用VisualStudioCode创建一个webapi项目(也可以是mvc等).一个类库(用于封装记录日志方法,当然如果使用依赖注入到控制台项目,就不需要此类库了). 二.在类库中添加NLog. ...
- 2018-2019-2 网络对抗技术 20165236 Exp6 信息搜集与漏洞扫描
2018-2019-2 网络对抗技术 20165236 Exp6 信息搜集与漏洞扫描 一.实验内容 1.实践目标 掌握信息搜集的最基础技能与常用工具的使用方法. 2.实践内容 (1)各种搜索技巧的应用 ...
- 面试 Java 高级后端开发,要准备哪些知识点?
其实公司肯花时间让你去面试,前提条件一定是通过你的简历,一定发现了你和公司的匹配点,也就是说,一定是有录用意向的. 在技术面试的时间段里(最长1个小时),你如果能展现你的优势那是最好的,但如果你做不到 ...
- adobe air for ios 应用完成appstore评论
1,跳转到App Store:NSString *str = [NSString stringWithFormat:@"http://itunes.apple.com/us/app/id%d ...