Question

我已经在离子3.0中调用了POST并且我得到了错误this.http.post在控制台中没有任何功能我尝试此链接来解决此错误：Ionic 3 TypeError: this.http.post is not a function但它不适用于我请告诉我有人如何解决这个错误？

let headers = new Headers({ 'Content-Type': 'application/json' });
 let options = new RequestOptions({ headers: headers });
    
  //Pass the data into the API and creat the user
    if(url != "" && url != undefined){
      this.http.post(url, object, options).subscribe(data => {
        console.log(data['_body']);
      }, error => {
        console.log(error);
      });
    }

的package.json

    {
  "name": "bob-app",
  "version": "0.0.1",
  "author": "Ionic Framework",
  "homepage": "http://ionicframework.com/",
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/common": "5.0.1",
    "@angular/compiler": "5.0.1",
    "@angular/compiler-cli": "5.0.1",
    "@angular/core": "5.0.1",
    "@angular/forms": "5.0.1",
    "@angular/http": "5.0.1",
    "@angular/platform-browser": "5.0.1",
    "@angular/platform-browser-dynamic": "5.0.1",
    "@ionic-native/core": "4.4.0",
    "@ionic-native/splash-screen": "4.4.0",
    "@ionic-native/status-bar": "4.4.0",
    "@ionic/storage": "2.1.3",
    "firebase": "^4.6.0",
    "ionic-angular": "3.9.2",
    "ionicons": "3.0.0",
    "ngx-color-picker": "^5.2.0",
    "rxjs": "5.5.2",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@ionic/app-scripts": "3.1.2",
    "@types/core-js": "^0.9.46",
    "typescript": "2.4.2"
  },
  "keywords": [
    "bob-app"
  ],
  "license": "ISC"
}

CreatAccount.ts

import { HttpModule,Headers,RequestOptions}        from '@angular/http';
import { HttpClient, HttpHeaders } from '@angular/common/http';

//app.module.ts
import { HttpModule}       from '@angular/http';
import { HttpClientModule } from '@angular/common/http';

Answer 1

不推荐使用Http和HttpModule。

删除这些导入。

根据需要在app模块或页面模块中导入HttpClientModule并设置为imports array。

在构造函数中注入如下：

constructor(http:HttpClient){}

在所需的提供商中。

Answer 2

更改此代码

// app.module.ts

import { HttpModule}       from '@angular/http';
import { HttpClientModule } from '@angular/common/http';

替换

import {HttpClientModule} from "@angular/common/http";

在CreatAccount.ts

中

import { HttpModule,Headers,RequestOptions}        from '@angular/http';
import { HttpClient, HttpHeaders } from '@angular/common/http';

替换

import {HttpClient,HttpHeaders} from "@angular/common/http";

然后更改

 let headers = new Headers({ 'Content-Type': 'application/json' });

要

headers : HttpHeaders = new HttpHeaders({ 'Content-Type': 'application/json' }); Then write a function postObject(){ if(url != "" && url != undefined){ this.platform.ready().then(() => { this.http.post(url, object, {headers: this.header}) .subscribe( data => { console.log(data['_body']); }, err => { console.log(err);} ); }) } }

Answer 3

如果您有以下代码，您的代码应该有效：

// app.module.ts

import { HttpClientModule } from '@angular/common/http';

...
 imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    HttpClientModule
  ],
...

// page.ts

import { HttpClient } from '@angular/common/http';
...
constructor(public http: HttpClient) {      
    }

postData() {
   let headers = new Headers({ 'Content-Type': 'application/json' });
   let options = new RequestOptions({ headers: headers });      
   //Pass the data into the API and create the user
   if(url != "" && url != undefined){
       this.http.post(url, object, options).subscribe(data => {
           console.log(data['_body']);
       }, error => {
           console.log(error);
       });
    }
}

如果您忘记将HttpClient添加到构造函数中，您将不会走得太远。

希望这有帮助。

Ionic 3 TypeError：this.http.post不是ionic3中的函数？

3 个答案: