angularhttp 요청의 다양한 전참 방식 총결

1.GET

    getData(data): Observable<any> {
     
        const url = `${
       this.config.url}/xxx`;
        return this.http.get(url, {
      params: data }).pipe(
            map(res => res)
        );
    }
    // url 
    getData2(data): Observable<any> {
     
        const url = `${
       this.config.url}/xxx?name=` + data.name +
        '&age=' + data.age +
        '&gender=' + data.gender +
        '&page=' + data.page +
        '&pageSize=' + data.pageSize;
        return this.http.get(url).pipe(
            map(res => res)
        );
    }

const info = {
     
   name:xxx,
   age:xxx,
   gender:xxx,
   page:1,
   pageSize:10
}
this.service.getData(info).subscribe(val=>{
     

})

2.POST

   addData(data): Observable<any> {
     
        const url = `${
       this.config.url}/addXXX`;
        return this.http.post(url,data).pipe(
            map((res: any) => {
     
                return res;
            })
        );
    }

const info = {
     
	name:xxx,
	age:xxx
}
this.service.addData(info).subscribe(val=>{
     

})

 login(data): Observable<any> {
     
      const url = `${
       this.config.login}`;
      return this.http.post(url, data).pipe(
          map((res: any) => {
     
              return res;
          })
      );
    }

const info = {
     
      username: this.form.value.userName,
      password: this.form.value.password
}
const params = new HttpParams({
     
  fromObject: info
});
 this.service.login(params).subscribe(val=>{
     
 
 })

testPost(data):Observabal<any>{
     
	const url = `${
       this.config.server}/pushed/dispose`;
	  return this.http.post(url,{
     },{
     params:data}).pipe(
	    map((res:any)=>{
     
	      return res;
	    })
	)
}

const data = {
     
	id:1
}
this.service.testPost(data).subscribe(val=>{
     
})

childPolicySubmit(data): Observable<any> {
     
      const headers = new Headers({
     
        'Content-Type': 'application/json; charset=utf-8'
      });
      return this.http.post(`${
       this.config.urlApi}/births/certificates`, data)
      .map((res:any) => res);
}

const data:any ={
     };
data.name="xxx";
data.age = 23;
this.service.childPolicySubmit(data).subscribe(val=>{
     

})

3.PUT

   updateData(data): Observable<any> {
     
        const url = `${
       this.config.url}/updatexxx`;
        return this.http.put(url,data).pipe(
            map((res: any) => {
     
                return res;
            })
        );
    }

const info = {
     
	id:1,
	name:xxx
}
this.service.updateData(info).subscribe(val=>{
     

})

4.DELETE

//  
   delMore(data): Observable<any> {
     
        const url = `${
       this.config.url}/XXX/remove`;
        return this.http.delete(url, {
     params: data}).pipe(
            map((res: any) => {
     
                return res;
            })
        );
    }
    //  
    delSingle(data): Observable<any> {
     
        const url = `${
       this.config.url}/remove/`+ data.id;
        return this.http.delete(url).pipe(
            map(res => res)
        );
    }

// 
	const info = {
     
      ids: this.selectIds.join(',')
    }
    const params = new HttpParams ({
     
      fromObject: info
    })
    this.service.delMoreOrg(params).subscribe(val=>{
     
	
	})
	// 
	const info = {
     
       id: this.selectIds.join(',')
    }
    this.service.delExp(info).subscribe(val=>{
     
    
    })

5. 특수 문자 문제 해결(+ 더하기 기호가 공백으로 전송됨)

 onlySubmit(data):Observable<any>{
     
    const info = this.commonFService.forEachData(data);
    const url = `${
       this.config.server}/report/post`;
    return this.http.post(url,info,
        {
     
          headers: new HttpHeaders({
     
            "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8"
          })
        }
      ).pipe(
        map((res:any)=>{
     
          return res;
        })
      )
  }

 forEachData(data){
     
    let str='';
    for(let i in data){
     
      if(i==='urls'){
     
        for(let j=0;j<data['urls'].length;j++){
     
          str = str +"urls="+data['urls'][j]+'&';//urls 
        }
      }else{
     
        str = str + i+"="+data[i]+'&';
      }
    }
    str = str.substring(0,str.length-1);// & 
    return str;
  }

let data = {
     
        fileNames: this.attachNames ? this.attachNames.join("|").replace(/\+/g,'%2B') : "",// %2b
        attachments: this.attachUrls ? this.attachUrls.join("|").replace(/\+/g,'%2B') : "",
        sourceSystem: "NBXC",
        comment:"",
        infoType: "2",
        urls:this.urlsList
    };
    this.service.onlySubmit(data).subscribe(val=>{
     
    })