客户端GET设置参数查询:

search() {
const params = new HttpParams()
.set('userName', this.userName)
.set('fullName', this.fullName);
this.http.get('/api/users', {params})
.subscribe(data => {
this.users = data['users'];
});
}
reset() {
this.userName = '';
this.fullName = '';
this.search();
}

node服务器响应:

app.get('/users', (req, res) => {
if (_.isEmpty(req.query.userName)&&_.isEmpty(req.query.fullName)) {
res.json({users: users});
} else {
res.json({
users: users.filter(
(user) =>
((user.userName).indexOf(req.query.userName)) > 0 ||
((user.fullName).indexOf(req.query.fullName)) > 0
)
});
}
});

跨域设置:

app.all('*', function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "X-Requested-With");
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By", ' 3.2.1');
res.header("Content-Type", "application/json;charset=utf-8");
next();
});

bodyParse use:

var express = require('express')
var bodyParser = require('body-parser')
var app = express()
// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))//extended为false表示使用querystring来解析数据,这是URL-encoded解析器
// parse application/json
app.use(bodyParser.json())//添加json解析器
app.use(function (req, res) {
res.setHeader('Content-Type', 'text/plain')
res.write('you posted:\n')
res.end(JSON.stringify(req.body, null, 2))
})
var jsonParser = bodyParser.json()//获取JSON解析器中间件
// create application/x-www-form-urlencoded parser
var urlencodedParser = bodyParser.urlencoded({ extended: false })//url-encoded解析器
// POST /login gets urlencoded bodies
app.post('/login', urlencodedParser, function (req, res) {//注册URL解析器
if (!req.body) return res.sendStatus(400)
res.send('welcome, ' + req.body.username)
})
// POST /api/users gets JSON bodies
app.post('/api/users', jsonParser, function (req, res) {//使用json中间件获取json数据
if (!req.body) return res.sendStatus(400)
// create user in req.body
})
// parse various different custom JSON types as JSON
app.use(bodyParser.json({ type: 'application/*+json' }))
// parse some custom thing into a Buffer
app.use(bodyParser.raw({ type: 'application/vnd.custom-type' }))
// parse an HTML body into a string
app.use(bodyParser.text({ type: 'text/html' }))

GET,POST,DELTE,PUT:

app.get('/users', function (req, res) {
if (_.isEmpty(req.query.userName) && _.isEmpty(req.query.fullName)) {
res.json({users: users});
}
else {
res.json({
users: users.filter(function (user) {
return ((user.userName).indexOf(req.query.userName)) > 0 ||
((user.fullName).indexOf(req.query.fullName)) > 0;
})
});
}
});
app.post('/users', jsonParser, urlencodedParser, function (req, res) {
var user = req.body.user;
users.push(user);
res.send('save success');
}); app.delete('/users/:id', function (req, res) {
const deleteUser = users.findIndex(function (user) {
return user.id === req.params.id;
});
users.splice(deleteUser, 1);
res.send('delete success');
});
app.put('/api/tour/:id',function (req,res) {
var id = req.params.id;
var p = tours.some(function (p) {
return p.id == id;
});
if(p){
if(req.query.name) tours[id].name = req.query.name;
if(req.query.price) tours[id].price = req.query.price;
res.json({success:true,tours:tours,p:p});
}else{
res.json({error:'No such tour exists.'});
}
});

@angular/cli项目构建--http(2)的更多相关文章

  1. @angular/cli项目构建--组件

    环境:nodeJS,git,angular/cli npm install -g cnpm --registry=https://registry.npm.taobao.org cnpm instal ...

  2. @angular/cli项目构建--modal

    环境准备: cnpm install ngx-bootstrap-modal --save-dev impoerts: [BootstrapModalModule.forRoot({container ...

  3. @angular/cli项目构建--Dynamic.Form

    导入所需模块: ReactiveFormsModule DynamicFormComponent.html <div [formGroup]="form"> <l ...

  4. @angular/cli项目构建--animations

    使用方法一(文件形式定义): animations.ts import { animate, AnimationEntryMetadata, state, style, transition, tri ...

  5. @angular/cli项目构建--interceptor

    JWTInterceptor import {Injectable} from '@angular/core'; import {HttpEvent, HttpHandler, HttpInterce ...

  6. @angular/cli项目构建--路由3

    路由定位: modifyUser(user) { this.router.navigate(['/auction/users', user.id]); } 路由定义: {path: 'users/:i ...

  7. @angular/cli项目构建--httpClient

    app.module.ts update imports: [ HttpClientModule] product.component.ts import {Component, OnInit} fr ...

  8. @angular/cli项目构建--路由2

    app.module.ts update const routes: Routes = [ {path: '', redirectTo: '/home', pathMatch: 'full'}, {p ...

  9. @angular/cli项目构建--路由1

    app.module.ts import {BrowserModule} from '@angular/platform-browser'; import {NgModule} from '@angu ...

  10. @angular/cli项目构建--Dynamic.Form(2)

    form-item-control.service.ts update @Injectable() export class FormItemControlService { constructor( ...

随机推荐

  1. 二值法方法综述及matlab程序

    在某些图像处理当中一个关键步是二值法,二值化一方面能够去除冗余信息,另一方面也会使有效信息丢失.所以有效的二值化算法是后续的处理的基础.比如对于想要最大限度的保留下面图的中文字,以便后续的定位处理. ...

  2. Quartz使用总结(转发:http://www.cnblogs.com/drift-ice/p/3817269.html)

    Quartz可以用来做什么? Quartz是一个任务调度框架.比如你遇到这样的问题 想每月25号,信用卡自动还款 想每年4月1日自己给当年暗恋女神发一封匿名贺卡 想每隔1小时,备份一下自己的爱情动作片 ...

  3. C#如何使用结构化异常处理

    Knowledge Base: Chinese (Simplified) 如何使用 Visual C# .NET 和 Visual C# 2005 中的结构化异常处理文章ID: 816157 最近更新 ...

  4. Android:日常学习笔记(9)———探究广播机制

    Android:日常学习笔记(9)———探究广播机制 引入广播机制 Andorid广播机制 广播是任何应用均可接收的消息.系统将针对系统事件(例如:系统启动或设备开始充电时)传递各种广播.通过将 In ...

  5. iOS 绘制漂亮的折线图

    效果图是这样的: 关键是在 基本策略 是描点 和 连线. 折线基础版本,我找到网上的第三方,UUChart . 特点是朴素,简单,扩展性强. 效果图重点是在折线要有阴影,于是 重点 放在 折线发散的阴 ...

  6. 【TopCoder】SRM151 DIV2 练习总结

    第一次做完整的SRM题,刷完感觉萌萌哒,不过自己对java中很多细节不熟练,还要边做题边google. 250分的题:判断字符串序列是否是前缀码,如果不是,返回第一个违反前缀码规则的字符串. 简单的暴 ...

  7. 用blastn比对自己建立的数据库

    自己感兴趣的一些序列作为数据库,然后用blastn把测序的read比对到自己建立的数据库中. 1.用fasta文件创建blast数据库 makeblastdb -in input_file -inpu ...

  8. java-jpa-criteriaBuilder使用入门

    项目中使用jpa ,第一次见查询起来一脸蒙,这就去查下jpa查询的方式,和概念. jpa 元模型 criteria 查询 CriteriaBuilder 安全查询创建工厂 CriteriaQuery ...

  9. C++中随机数的生成

    1.随机数由生成器和分布器结合产生 生成器generator:能够产生离散的等可能分布数值 分布器distributions: 能够把generator产生的均匀分布值映射到其他常见分布,如均匀分布u ...

  10. Linux mysql主从同步配置

    一.在两台Ubuntu机器上安装mysql1.检查系统中是否安装了mysql 这个是已经安装了的 没有安装的话执行上条命令===============================MySQL的一些 ...