1 import { Injectable } from '@angular/core';
 2 import { HttpClient, HttpParams, HttpHeaders } from '@angular/common/http';
 3 
 4 @Injectable({
 5   providedIn: 'root',
 6 })
 7 export class ObHttpService {
 8 
 9   static readonly API_HOST = 'http://192.168.1.116:7878';
10 
11   constructor(
12     private http: HttpClient
 
13   ) { }
14 
15   get(url: string, params: Object) {
16 
17   }
18 
19   post(url: string, params: Object) {
20     const httpOptions = {
21       headers: new HttpHeaders({
22         'Content-Type':  'application/x-www-form-urlencoded',
23       })
24     };
25 
26     const body = new HttpParams();
 
27     let query = '';
28     for (const key in params) {
29       if (params.hasOwnProperty(key)) {
30         const element = params[key];
31         query += encodeURIComponent(key) + '=' + encodeURIComponent(element) + '&';
32       }
33     }
34 
35     console.log(query);
36     return this
 
.http.post(ObHttpService.API_HOST + url , query, httpOptions
37     );
38 
39   }
40 
41 
42 }

import { ObHttpService } from './../../services/obhttp.service';

import { Component, OnInit } from '@angular/core';
import 'rxjs/add/operator/map';


@Component({
  selector: 'app-tlist3',
  templateUrl: './tlist3.component.html',
  styleUrls: ['./tlist3.component.less']
})
export class Tlist3Component {

  constructor(
    private http: ObHttpService
  ) { }

  data = {};

  onSubmit() {

    this.http.post('/guestBooks/save', this.data).subscribe(data => {

    });
  }
}