Question

我知道在这个平台上已经提出了这个问题，但我无法确定解决问题的方法。我正在为一个应用程序创建一个登录页面，该页面使用http从mysql数据库获取用户的登录详细信息。在我的 MyproviderProvider 上，我收到 Property＆＃39; http＆＃39;类型＆＃39; MyproviderProvider＆＃39;。上不存在。我已经导入了它所需的所有模块，甚至使http私有，但它仍然没有改变任何东西。

以下是我的代码：

的login.html

<ion-content class="login-content" padding>
  <ion-row class="logo-row">
    <ion-col></ion-col>
    <ion-col >
      <img src="../assets/imgs/logo.png" class="img-responsive " id="img2">
    </ion-col>
    <ion-col></ion-col>
  </ion-row>
  <div class="login-box">
    <form (ngSubmit)="login()" #registerForm="ngForm">
      <ion-row>
        <ion-col>
          <ion-list inset>

            <ion-item>
              <ion-input type="text" placeholder="Email" name="email" [(ngModel)]="registerCredentials.email" required></ion-input>
            </ion-item>

            <ion-item>
              <ion-input type="password" placeholder="Password" name="password" [(ngModel)]="registerCredentials.password" required></ion-input>
            </ion-item>

          </ion-list>
        </ion-col>
      </ion-row>

      <ion-row>
        <ion-col class="signup-col">
          <div align="center">
          <button ion-button class="submit-btn" full type="submit" [disabled]="!registerForm.form.valid">Login</button>
          <span class="tell">- or -</span>
          <button ion-button class="register-btn" type="button" block clear (click)="createAccount()">Create New Account</button>
        </div>
        </ion-col>
      </ion-row>

    </form>
  </div>
</ion-content>

MyproviderProvider（提供者）

import { HttpClient } from '@angular/common/http';
import { Http } from '@angular/http';
import { Storage } from '@ionic/storage';
import { Injectable } from '@angular/core';
import {Observable} from 'rxjs/Observable';
import 'rxjs/add/operator/map';


export class User {
  name: string;
  email: string;

  constructor(private http: Http) {

  }

}

@Injectable()
export class MyproviderProvider {


  currentUser: User;

  public login(credentials) {
    if (credentials.email === null || credentials.password === null) {
      return Observable.throw("Please insert Login Details");
    } else {
      return Observable.create(observer => {
        this.http.post('your url?email'+credentials.email+'&password='+credentials.password)
        .map(res => res.json())
        .subscribe(data =>
        {        
        console.log(data)//you can format the response from your server
        observer.next(data );//and then return data
        observer.complete();
        });
        });
    }
  }

  public register(credentials) {
    if (credentials.email === null || credentials.password === null) {
      return Observable.throw("Please insert credentials");
    } else {
      // At this point store the credentials to your backend!
      return Observable.create(observer => {
        observer.next(true);
        observer.complete();
      });
    }
  }

  public getUserInfo() : User {
    return this.currentUser;
  }

  public logout() {
    return Observable.create(observer => {
      this.currentUser = null;
      observer.next(true);
      observer.complete();
    });
  }

}

app.module

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { HttpModule } from '@angular/http';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';


import { MyApp } from './app.component';

import { MyproviderProvider } from '../providers/myprovider/myprovider';

import { IonicStorageModule } from '@ionic/storage';

@NgModule({
  declarations: [
    MyApp
  ],
  imports: [
    BrowserModule,
    HttpModule,
    IonicModule.forRoot(MyApp),
    IonicStorageModule.forRoot()
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    MyproviderProvider
  ]
})
export class AppModule {}

Answer 1

您constructor班级中缺少MyproviderProvider

constructor(private http: HttpClient ){}

您已在http课程中声明了变量User，但未在MyproviderProvider课程中声明

<强> FYI

Http已被弃用，您应该更改为HttpClient。

因此，您不需要将响应数据转换为JSON格式（ .map（res =＆gt; res.json（）） ）作为转换现在由HttpCLient完成。

 this.http.post('your url?email'+credentials.email+'&password='+credentials.password)
   .subscribe(data => {        
       console.log(data)//you can format the response from your server
       observer.next(data );//and then return data
       observer.complete();
    });

物业＆＃39; http＆＃39;类型＆＃39; MyproviderProvider＆＃39;

1 个答案: