javascript - 刷新后使用 ng-click 在 html 中显示 session

Question

我正在使用 express-session 来保存产品价格。一切似乎都很好，但我在 html 中显示 session 时遇到问题。例如，如果我在 session 中有 2 个产品，我添加下一个徽章将显示 3，当我刷新页面时徽章隐藏，然后添加下一个产品徽章将显示 4。如果我尝试像 {{ session.cart.totalQty }} 这样的显示 session ，这是行不通的。 main 是 controllerAs，cart 是添加产品、计算总价等功能，User.addToCart(...) 是服务功能返回 $http。问题是即使刷新页面，如何显示session totalQty？

html

<sapn class="badge">{{totalQty}}</span>
<a data-target="#" ng-click="main.addCart(price)" class="btn btn-success btn-block">Add to cart</a>

Controller

app.addCart = function(product){
    User.addToCart($routeParams.id).then(function(data){ 
        $scope.totalQty = data.data.cart.totalQty;
    });
}

和API

router.get('/add-to-cart/:id', function(req, res){
    var cart = new Cart(req.session.cart ? req.session.cart : {});
    Product.findById({ _id : req.params.id }, function(err, product){ 
        if(err) throw err
        if(!product){
            res.json({success:false, message: 'err'});
        } else {

            cart.add(product, product.id);
            req.session.cart = cart;
            res.json({ success:true, product: product, cart:cart });

        }
    })  

});

Answer 1

您可以使用 localStorage 在从服务器加载之前存储徽章计数。

类似于:

User.addToCart($routeParams.id).then(function(data){ 
    $scope.totalQty = data.data.cart.totalQty;
    localStorage.totalQty = $scope.totalQty;
});

当你加载你的 Controller 时，只需调用:

$scope.totalQty = localStorage.totalQty || 0;

---

我建议你查看angular-local-storage将通过 Angular 方式管理 localStorage 的模块。