Verwenden von Speichern mit ionischen 2

Question

Ich versuche, die Lagerung in Ionic 2 zu verwenden, wie die Dokumentation zeigt:

ionic storage ducumentation

import {Http} from '@angular/http'; 
import { Injectable } from '@angular/core'; 
import {Observable} from 'rxjs/Observable'; 
import {Component} from '@angular/core'; 
import {Storage} from '@ionic/storage'; 
import 'rxjs/add/operator/map'; 
// import {GlobalVars, getMyGlobalVar} from './global-vars'; 



export class User { 
    token: string; 

    constructor(token: string) { 
    this.token = token 
    } 
} 

@Injectable() 
export class AuthService { 

    static get parameters() { 
     return [[Http]]; 
    } 

    constructor(public http: Http, storage:Storage) { 
     this.http = http; 
     this.storage = storage; 
    } 

    currentUser: User; 
    public login(credentials) { 
    // console.log(getMyGlobalVar()) 
    if (credentials.username === null || credentials.password === null) { 
     return Observable.throw("Please insert credentials"); 
    } else { 
     return Observable.create(observer => { 
     // At this point make a request to your backend to make a real check! 
     // send username and password to server 
     // save user auth token 


        var creds = {username:credentials.username, password:credentials.password} 
        this.http.post('http://someurl.com/api-token-auth/', creds).subscribe(data => { 
      this.storage.set('1984_token', data.json().token); 
         let access = (true); 
         this.currentUser = new User(data.json().token); 
         observer.next(access); 
         observer.complete(); 

        }, error => { 
       let access = (false); 
         observer.next(access); 
      },() => { 

        }); 
     }); 
    } 
    } 


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

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

Man sagt, es nicht Eigentum von undefined gesetzt, so Lagerung ist nicht definiert. Stprage wird auch in app.module importiert und als Provider hinzugefügt. Ich bin dabei, dies in einem Provider zu speichern.

Runtime Error 
Cannot read property 'set' of undefined 
Stack 
TypeError: Cannot read property 'set' of undefined 
    at SafeSubscriber._this.http.post.subscribe.access [as _next] (http://localhost:8100/build/main.js:37296:34) 
    at SafeSubscriber.__tryOrUnsub (http://localhost:8100/build/main.js:44390:16) 
    at SafeSubscriber.next (http://localhost:8100/build/main.js:44339:22) 
    at Subscriber._next (http://localhost:8100/build/main.js:44292:26) 
    at Subscriber.next (http://localhost:8100/build/main.js:44256:18) 
    at XMLHttpRequest.onLoad (http://localhost:8100/build/main.js:54386:38) 
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:9723) 
    at Object.onInvokeTask (http://localhost:8100/build/main.js:34819:37) 
    at t.invokeTask (http://localhost:8100/build/polyfills.js:3:9659) 
    at e.runTask (http://localhost:8100/build/polyfills.js:3:7083) 
Ionic Framework: 2.0.0-rc.5 
Ionic Native: 2.2.11 
Ionic App Scripts: 1.0.0 
Angular Core: 2.2.1 
Angular Compiler CLI: 2.2.1 
Node: 4.4.4 
OS Platform: macOS Sierra 
Navigator Platform: MacIntel 
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.95 Safari/537.36 

Ich kann nicht eine klare Dokumentation finden, wie man diese

package.json verwenden:

{ 
    "name": "ionic-hello-world", 
    "author": "Ionic Framework", 
    "homepage": "http://ionicframework.com/", 
    "private": true, 
    "scripts": { 
    "clean": "ionic-app-scripts clean", 
    "build": "ionic-app-scripts build", 
    "ionic:build": "ionic-app-scripts build", 
    "ionic:serve": "ionic-app-scripts serve" 
    }, 
    "dependencies": { 
    "@angular/common": "2.2.1", 
    "@angular/compiler": "2.2.1", 
    "@angular/compiler-cli": "2.2.1", 
    "@angular/core": "2.2.1", 
    "@angular/forms": "2.2.1", 
    "@angular/http": "2.2.1", 
    "@angular/platform-browser": "2.2.1", 
    "@angular/platform-browser-dynamic": "2.2.1", 
    "@angular/platform-server": "2.2.1", 
    "@ionic/storage": "^1.1.7", 
    "ionic-angular": "2.0.0-rc.5", 
    "ionic-native": "2.2.11", 
    "ionicons": "3.0.0", 
    "rxjs": "5.0.0-beta.12", 
    "sw-toolbox": "3.4.0", 
    "zone.js": "0.6.26" 
    }, 
    "devDependencies": { 
    "@ionic/app-scripts": "1.0.0", 
    "typescript": "2.0.9" 
    }, 
    "cordovaPlugins": [ 
    "cordova-plugin-whitelist", 
    "cordova-plugin-statusbar", 
    "cordova-plugin-console", 
    "cordova-plugin-device", 
    "cordova-plugin-splashscreen", 
    "ionic-plugin-keyboard" 
    ], 
    "cordovaPlatforms": [ 
    "ios", 
    { 
     "platform": "ios", 
     "version": "", 
     "locator": "ios" 
    } 
    ], 
    "description": "isango_mobile: An Ionic project" 
} 

Answer 1

In Typoskript Sie müssen this verwenden Klassenvariablen zuzugreifen.

export class MyApp { 
    constructor(public storage: Storage) { 
    //this.storage = storage; this line is not required as you have set access specifier in constructor parameter. 
    } 
    foo() { 
    this.storage.set('name', 'Max'); 
    } 

Answer 2

Ok ich benutze so und arbeite für mich.

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

constructor(
private storage : Storage){} 

foo(){ 
    this.storage.set('name','Max'); 
} 

Und keine Notwendigkeit einer Änderung in app.module

Answer 3

ich das gleiche Problem bin, funktioniert für mich in Seiten fein und protokolliert mein Test-Token in einer anderen Seite gesetzt Z.B.

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

    export class AccountPage { 

     settings: AppSettings; 
     loading: any; 

     constructor(public http: Http, public navCtrl: NavController, public storage: Storage, private platform: Platform, private loadingCtrl: LoadingController, public authService: AuthService) { 

     } 

    ionViewDidLoad() { 
    this.storage.get('token').then((token) => { 
      console.log('token ' + token); 
     }); 
     } 

Aber ich finde es undefined in Anbietern. Verwenden von "public storage: Storage" im Konstruktor, um sowohl Storage zu injizieren als auch this.storage zu erhalten/setzen.

Ich handle Storage auf die gleiche Weise für die Seiten & Anbieter, aber keine Freude mit Anbietern. Haben Lagerung in app.module.ts hinzugefügt:

@NgModule({ 
    declarations: [ 
    RVCommunityApp, 
    AccountPage, 
    DirectoryPage, 
    FaqPage, 
    ModalPage, 
    OffersPage, 
    OfferDetailsPage, 
    QRCodePage, 
    TabsPage, 
    TouchpointsPage, 
    TouchpointDetailsPage, 
    VendorPage 
    ], 
    imports: [ 
    IonicModule.forRoot(RVCommunityApp, { 
     tabsPlacement: 'bottom', 
     statusbarPadding: true, 
     tabSubPages: true, 
     platforms: { 
     ios: { 
      statusbarPadding: true 
     } 
     } 
    }, {}), 
    CloudModule.forRoot(cloudSettings) 
    ], 
    bootstrap: [IonicApp], 
    entryComponents: [ 
    RVCommunityApp, 
    AccountPage, 
    DirectoryPage, 
    FaqPage, 
    ModalPage, 
    OffersPage, 
    OfferDetailsPage, 
    QRCodePage, 
    TabsPage, 
    TouchpointsPage, 
    TouchpointDetailsPage, 
    VendorPage 
    ], 
    providers: [AuthService, CategoryService, ConnectivityService, ContentService, DirectoryService, ModalService, OffersService, TouchpointService, AppSettings, Storage] 
}) 
export class AppModule {}