与离子2

Question

我试图使用存储在离子2作为文档显示使用Storage：

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(); 
    }); 
    } 
} 

它最高审计机关也不能设定的未定义的属性，所以存储是不确定的。 Stprage也在app.module中导入并作为提供者添加。我正试图将其存储在提供程序中。

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 

我找不到任何明确的文件如何使用这个

的package.json：

{ 
    "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

在你需要使用this访问类变量打字稿。

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

好吧，我用这样的，为我工作。

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

constructor(
private storage : Storage){} 

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

而且在app.module

Answer 3

我有同样的问题，不需要任何改变，工作正常，我在页面和登录我的测试令牌另一个页面设置例如

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); 
     }); 
     } 

但我觉得它在提供商中是未定义的。在构造函数中使用'public storage：Storage'来注入Storage，然后使用this.storage来获取/设置。

我正在处理提供商的页面&存储方式相同，但使用提供商没有喜悦。有存储在app.module.ts补充说：

@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 {}