发表于: 2019-07-04 21:26:32

1 916


  1. HttpClient Get请求。今天完成的事情:(一定要写非常细致的内容,比如说学会了盒子模型,了解了Margin) 

    1. 明天计划的事情:(一定要写非常细致的内容) 
      遇到的问题:(遇到什么困难,怎么解决的) 
      收获:(通过今天的学习,学到了什么知识)
  2. HTTP GET 请求参数: HttpParams 
    1. 请求第1页,最大条数2: 
      1. url方式 
        http://127.0.0.1:3000/customers?_page=1&_limit=1
      2. 使用httpClient实现 
        1. 导入HttpParams 
          import {HttpParams} from "@angular/common/http";
        2. 构建一个 HttpParams 对象 
          const params = new HttpParams().set('_page', "1").set('_limit', "1");
        3. 呼叫 .get() 方法并携带参数,然后将返回的 Observable 对象分配给customersObservable。(params 要与get在同一个方法中) 
          this.customersObservable = this.httpClient.get("http://127.0.0.1:3000/customers", {params});
        4. 使用更简单的方法新建HttpParams对象:【fromString】 
          const params = new HttpParams({fromString: '_page=1&_limit=1'});
      3. 带参Get请求(记url QueryString) 

        const params = new HttpParams({fromString: '_page=1&_limit=1'}); 
        this.customersObservable = this.http 
        .request("GET","http://127.0.0.1:3000/customers", 

        responseType:"json", 
        params 
        }); 
  3. 添加 HTTP Headers 
    1. 导入HttpHeaders 
      import { HttpHeaders } from '@angular/common/http';
    2. 新建客制的HttpHeader对象 
      const headers = new HttpHeaders().set("X-CustomHttpHeader", "CUSTOM_VALUE");
    3. 发送带httpHeader的请求 

      const headers = new HttpHeaders().set("X-CustomHttpHeader", "CUSTOM_VALUE"); 
      this.customersObservable = this.httpClient.get("http://127.0.0.1:3000/customers", {headers}); 
    4. 携带httpHeader,会出现重复请求的状况,第一次Option请求 204状态(Firefox 为Option请求方法),第二次为返回的结果。
  4. 发送HTTP PUT 请求 
    HTTP PUT 方法用来完全替换 API server上的资源。用HttpClient 发送PUT 请求替换Customers上id为1的资源: 

    this.httpClient.put("http://127.0.0.1:3000/customers/1", 

    "name": "NewCustomer001", 
    "email": "newcustomer001@email.com", 
    "tel": "0000252525" 
    }) 
    .subscribe( 
    data => { 
    console.log("PUT Request is successful ", data); 
    }, 
    error => { 
    console.log("Rrror", error); 

    ); 
  5. 发送HTTP PATCH 请求 
    HTTP PATCH 用来更新API server上的资源。 
    this.httpClient.patch("http://127.0.0.1:3000/customers/1", 

    "email": "newcustomer001@gmail.com" 
    }) 
    .subscribe( 
    data => { 
    console.log("PUT Request is successful ", data); 
    }, 
    error => { 
    console.log("Error", error); 

    ); 
  6. 发送HTTP DELETE 请求 
    HTTP DELETE 用来删除 API server上的资源 
    this.httpClient.delete("http://127.0.0.1:3000/customers/1") 
    .subscribe( 
    data => { 
    console.log("DELETE Request is successful ", data); 
    }, 
    error => { 
    console.log("Error", error); 

    ); 
  7. 发送 HTTP POST 请求 
    HTTP POST 方法有很多用途,大多数是用来在API server上新增一笔数据。 
    this.httpClient.post("http://127.0.0.1:3000/customers", 

    "name": "Customer004", 
    "email": "customer004@email.com", 
    "tel": "0000252525" 
    }) 
    .subscribe( 
    data => { 
    console.log("POST Request is successful ", data); 
    }, 
    error => { 
    console.log("Error", error); 

    ); 



返回列表 返回列表
评论

    分享到