Ionic2使用离子存储内提供

我一直试图实现对节点的应用程序身份验证提供者，它使用JWTIonic2使用离子存储内提供

我收到提示

TypeError: Cannot read property 'set' of undefined

我app.module.ts看起来像下面。

import { BrowserModule } from '@angular/platform-browser'; 
import { ErrorHandler, NgModule } from '@angular/core'; 
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular'; 

import { MyApp } from './app.component'; 
import { HomePage } from '../pages/home/home'; 
import { LoginPage } from '../pages/login/login'; 

import { StatusBar } from '@ionic-native/status-bar'; 
import { SplashScreen } from '@ionic-native/splash-screen'; 

import { HttpModule } from '@angular/http'; 
import { Auth } from '../providers/auth/auth'; 

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

export function provideStorage() { 
return new Storage({ name: '__mydb' } /* optional config */); 
} 

@NgModule({ 
    declarations: [ 
    MyApp, 
    HomePage, 
    LoginPage 
    ], 
    imports: [ 
    BrowserModule, 
    IonicModule.forRoot(MyApp), 
    HttpModule, 
    // IonicStorageModule.forRoot({ 
    // name: '__mercury', 
    // driverOrder: ['indexeddb', 'websql'] 
    // }) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    MyApp, 
    HomePage, 
    LoginPage 
    ], 
    providers: [ 
    StatusBar, 
    SplashScreen, 
    LoginPage, 
    { provide: Storage, useFactory: provideStorage }, 
    { provide: ErrorHandler, useClass: IonicErrorHandler }, 
    Auth 
    ] 
}) 
export class AppModule { }

我https://github.com/driftyco/ionic-storage/tree/v2.0.1#configuring-storage-new-in-117

我auth.provider.ts

import { Injectable } from '@angular/core'; 
import { Http, Response, Headers } from '@angular/http'; 
import 'rxjs'; 
import { Storage } from '@ionic/storage'; 
/* 
    Generated class for the AuthProvider provider. 

    See https://angular.io/docs/ts/latest/guide/dependency-injection.html 
    for more info on providers and Angular 2 DI. 
*/ 
@Injectable() 
export class Auth { 
    baseUrl: string = "http//localhost:9080/" 

    constructor(public http: Http, public storage: Storage) { 
    console.log('Hello AuthProvider Provider'); 
    } 

    createAuthorizationHeader(headers: Headers) { 
    let token; 
    this.storage.get('token').then(data => token = data); 
    headers.append('Athorization', token); 
    } 

    login(data) { 
    return this.http.post('//localhost:9080/auth', data) 
     .map(this.extractData); 
    } 

    isLogged() { 
    this.storage.get('token').then(data => { 
     if (data) 
     return true; 
     else 
     return false; 
    }).catch(err => { 
     return false; 
    }); 
    return false; 
    } 

    logout() { 
    this.storage.remove('token'); 
    return true; 

    } 

    private extractData(res: Response) { 
    console.log(res); 
    let body = res.json(); 
    if (body.success === true) { 

     this.storage.set("token", body.token); 


    }; 
    return body || {}; 
    } 
}

我的平台的详细信息是用于文档

Ionic Framework: 3.2.1 
Ionic Native: ^3.5.0 
Ionic App Scripts: 1.3.7 
Angular Core: 4.1.0 
Angular Compiler CLI: 4.1.0 
Node: 6.10.3 
OS Platform: macOS Sierra 
Navigator Platform: MacIntel 
Ionic Storage : ^2.0.1

来源

2017-05-24 user2473015

'IonicStorageModule.forRoot'不工作？你使用的是哪个版本的'@ ionic/storage'？ –

''返回新的存储（['sqlite'，'websql'，'indexeddb']，{name：'__mydb'}/*可选配置* /）;'您的'新'Storage'调用缺少参数.. –

可能[如何在回调中访问正确的\'this \'上下文？]（https://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-context-inside-a-回调） – echonax

变化

login(data) { 
    return this.http.post('//localhost:9080/auth', data) 
     .map(this.extractData); 
}

到

login(data) { 
    return this.http.post('//localhost:9080/auth', data) 
     .map(this.extractData.bind(this)); 
}

或

login(data) { 
    return this.http.post('//localhost:9080/auth', data) 
     .map((data)=>this.extractData(data)); 
}

你this不是指的你的组件

来源

2017-05-24 06:09:01 echonax

'login（data）{ return this.http.post（'// localhost：9080/auth'，data） .map（（data）= > this.extractData（数据））; }' 修复了这个问题 – user2473015

Ionic2使用离子存储内提供

回答

相关问题