如何使用ionic2框架登錄後如何存儲用戶ID

Question

我是離子2的新用戶，並且存儲我的用戶數據時存在問題，該數據存儲在我的注射服務中的類中以供登錄請幫助我：

AUTH-service.ts

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

    constructor(nom: string, email: string) { 
    this.nom = nom; 
    this.email = email; 
} 
} 
    @Injectable() 
    export class AuthService { 
    currentUser: User; 
    members: Array<any>; 
    nomUser:string; 
    emailUser:string; 

     constructor(public http: Http) { 
       console.log('Hello Authentification'); 
      } 

     public login(credentials) { 
     if (credentials.email === null || credentials.password === null) { 
     return Observable.throw("Please insert credentials"); 
     } else { 
     return Observable.create(observer => { 
     var url = 'http://localhost/PFEBACKEND/login-client.php? 
     email='+credentials.email+'&passe='+credentials.password ; 

     this.http.get(url).map(res => res.json()).subscribe(
      data=>{                  
       let access = (data.error=== 0) 

       this.currentUser = new User(data.nom,data.email); 

       console.log(this.currentUser); 
        observer.next(access); 
        observer.complete(); 
        }, 
        err => { 
        console.log(err); 
        }, 
        () => console.log('authentifié')); 

       }); 
    } 

      public getUserInfo() { 
      return this.currentUser ; 
      } 

home.ts

import { AuthService } from '../../providers/auth-service'; 
import { Http, Headers, RequestOptions } from '@angular/http'; 
import {Observable} from 'rxjs/Observable'; 
import { Component,Inject } from '@angular/core'; 
import { NavController, NavParams,LoadingController } from 'ionic-angular'; 

    export class HomePage { 
      nom:string= ''; 
      email:string= ''; 

    constructor(public http: Http,public navCtrl: NavController, private 
    auth:AuthService,public data:Datamembers, public navParams:NavParams, 
    public loadingCtrl:LoadingController) 
    {  
    let info = this.auth.getUserInfo(); 
    this.email = info.email; 
    this.nom = info.nom; 
    } 
    } 

錯誤：

nav-controller-base.js:88 Failed to navigate: Cannot read property 'email' of undefined (anonymous) @ nav-controller-base.js:88
core.es5.js:1085 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'email' of undefined

Answer 1

除了這個，你已經獲得了絕大部分的權利 - 你不能直接從一個observable到一個方法的調用類中返回數據。您需要傳遞該可觀察值。在調用類中解析它。讓我爲你糾正這個問題。

return Observable.create(observer => { 
    var url = 'http://localhost/PFEBACKEND/login-client.php?email='+credentials.email+'&passe='+credentials.password ; 

this.http.get(url).map(res => res.json()).subscribe(
    data=>{                  
     let access = (data.error=== 0) 

     this.currentUser = new User(data.nom,data.email); 

     console.log(this.currentUser); 
     observer.next(this.currentUser); 
     observer.complete(); 
    }, 
    err => { 
     console.log(err); 
     observer.error(err); 
    }, 
    () => console.log('authentifié') 
); 

而且在home.ts：

this.auth.getUserInfo().subsribe((data) => { 
    this.email = data.email; 
    this.nom = data.nom; 
},(err) => { 
    console.log("Error :",err); 
}); 

注：在這裏，我假設this.currentUser, access對你很重要。如果他們不是，最後如果您需要home.ts中的所有內容，則只需刪除這兩個語句，然後在那裏執行observer.next(data);。

Answer 2

您需要resolve的email的promise內，如下圖所示。

this.auth.getUserInfo().then((i) => { 
    this.email = i.email; 
    this.nom = i.nom; 
    }