Question

我正在使用angular和firebase，我有一个产品数组，我存放在我的rootcope中，虽然加载这些项目需要时间。

我的问题是，当我直接转到此页面时： http://localhost/product/greyish-sports-shoes

如果我转到主页，产品会在2秒后加载..然后只有当我点击产品链接时它才会显示它，并且它会起作用，因为产品已经加载。

它转到包含products数组的shoeService，但是这些项目仍未加载，因此无法通过slug找到该产品。

这是我在run方法中使用的代码。

   var ref = firebase.database().ref().child('products');

    $rootScope.shopProds = $firebaseArray(ref);

我的鞋服厂：

 function shoeFactory($rootScope) {
    this.service = {};

    this.service.store = new Store($rootScope.shopProds);
    this.service.cart = new Cart();

    return this.service;
}

Answer 1

重要的是要意识到$firebaseArray服务返回一个最初为空的数组。从服务器返回数据后，将异步填充数组。

使用附加到数组的$loaded方法返回的保证：

function shoeFactory($rootScope) {
    this.service = {};

    this.service.storePromise = $rootScope.shopProds.$loaded()
      .then ( (shopProds) => {
         return new Store(shopProds);
    });                   

    this.service.cartPromise = this.service.storePromise
      .then ( () => {
        return new Cart();
    }).catch( (error) => {
        console.log("ERROR in shoeFactory");
        throw error;
    }); 

    return this.service;
}

为避免竞争条件，代码需要使用promises来进行连锁操作。

Angular firebase获取单个项目具有竞争条件

1 个答案: