2

我已经创建了一个ionic 2 application购物车功能，但是当我转到其他页面并在这种情况下打开时我的问题是购物车是空的save the item in the cartthe cart

我的问题：

如何创建购物车功能并从下面的代码中检索另一个页面？

这是我的代码：

用户数据.ts：

import { Injectable } from '@angular/core';
import { Events, LocalStorage, Storage } from 'ionic-angular';

@Injectable()
export class UserData {
  _cart = [];
  HAS_LOGGED_IN = 'hasLoggedIn';
  storage = new Storage(LocalStorage);

  constructor(public events: Events) {}

  hasItem(item) {
    return (this._cart.indexOf(item) > -1);
  }

  addToCart(item) {
    this._cart.push(item);
  }

  removeFromCart(item) {
    let index = this._cart.indexOf(item);
    //item.checked=false;
    if (index > -1) {
      this._cart.splice(index, 1);
    }
  }

  clearCart(){
    this._cart = [];
  }

  indexOfItem(item) {
    return this._cart.indexOf(item);
  }

  countOfCart() {
    return this._cart.length;
  }

  login(name) {
    this.storage.set(this.HAS_LOGGED_IN, true);
    this.setUsername(name);
    this.events.publish('user:login');
  }

  signup() {
    this.storage.set(this.HAS_LOGGED_IN, true);
    this.events.publish('user:signup');
  }

  logout() {
    this.storage.remove(this.HAS_LOGGED_IN);
    this.storage.remove('username');
    this.events.publish('user:logout');
  }

  setUsername(username) {
    this.storage.set('username', username);
  }
  getUsername() {
    return this.storage.get('username').then((value) => {
      return value;
    });
  }

  // return a promise
  hasLoggedIn() {
    return this.storage.get(this.HAS_LOGGED_IN).then((value) => {
      return value;
    });
  }
}
4

1 回答 1

3

您的代码似乎是正确的，但是为了使用该类的相同实例UserData，您应该将其包含在必须共享它们的最顶层组件的 providers 数组中。

这是什么意思？好吧，如果您UserData在 Page1 的 providers 数组中包含该类，该类的一个新实例将被注入到您的页面中。问题是，如果您还将它包含在 Page2 的 providers 数组中，那么UserClass该页面中也会注入一个新的（不同的）实例。因此，您在 Page1 中将商品添加到购物车的实例与您在 Page2 中用于读取购物车内容的实例不同。这就是为什么它似乎是空的。

如果您希望能够在整个应用程序中使用该类的相同实例，则应将其包含在应用程序的最顶层组件中：

@Component({
  template: '<ion-nav [root]="rootPage"></ion-nav>',
  providers: [UserData]
})

通过这样做，类的相同实例将在整个应用程序中使用。

于 2016-08-16T08:23:26.007 回答