Angular 5 - HttpClient Post没有发布

时间:2018-01-26 09:06:17

标签: angular typescript angular5

我有一个httpClient帖子,通过服务,它没有给我任何错误,但它也没有将数据发布到数据库。

以下是代码:

dataService.ts

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

const httpOptions = {
  headers: new HttpHeaders({ 'Content-Type': 'application/json' })
};

@Injectable()
export class DataService {

  constructor(private http: HttpClient) {}

  insertData() {
    const body = JSON.stringify({firstName: 'Joele', lastName: 'Smith4'});
    return this.http.post('http://myurl/index.php', body, httpOptions);
  }

}

app.component.ts

import { Component } from '@angular/core';
import { DataService } from './services/data.service';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {

  constructor(private dataService: DataService) {}

  myInsert() {
    if (this.dataService.insertData()) {
      alert('Data Inserted Successfully');
    }

  }

}

最后是app.component.html

<div (click)="myInsert()">Click Me</div>

我已经在Chrome网络上检查了帖子,但没有显示任何内容。 我该如何解决这个问题?

3 个答案:

答案 0 :(得分:22)

需要观察可观察者提出请求。

myInsert() {
  this.dataService.insertData().subscribe(
    response => console.log(response),
    err => console.log(err)
  );
}

答案 1 :(得分:1)

我有同样的问题,我使用这样(使用FormData)。试试吧。它适合我。

insertData() {
    let body = new FormData();
    body.append('firstName', 'Joele');
    body.append('lastName', 'Smith4');

    return this.http.post('http://myurl/index.php', body, httpOptions);
}

答案 2 :(得分:0)

PS C:\> "notepad.exe" | cmd