如何从一个控制器中刷新另一个控制器的计数器值

how to refresh counter value of one controller from another angularjs

本文关键字：控制器 刷新 另一个 计数器 一个      更新时间：2023-09-26

我有一个购物车计数器，这是在头部控制器。添加到购物车按钮在图像视图控制器中。我想从图像视图控制器设置购物车计数器。所以每次点击添加到购物车时，它都会改变购物车的值。

头部控制器:

 decorpotCtrls.controller('DecorpotCtrl', [ '$scope', '$routeParams', 'cart',
    function($scope, $routeParams, cart) {
        $scope.cartCounter = cart.getCartCounter();
    } ]);

图像控制器:- 

  decorpotCtrls.controller('ImageViewController', [
    '$scope',
    '$routeParams',
    'imageView',
    '$auth',
    'cart',
    function($scope, $routeParams, imageView, $auth, cart) {
    $scope.addToCart = function(groupid) {
            console.log($auth.isAuthenticated());
            return cart.addToCart(groupid);
        };
    } ]);

购物车Html: - 

  <i class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></i> Cart({{cartCounter}})

从图像控制器添加购物车- 

 <div id="addToCart" class="btn btn-primary btn-lg buyNCartButton" ng-click="addToCart(groupid)">Add To Cart</div>

购物车服务- 

services.service('cart', function($http){
    var counter =0 ;
    sessionStorage.setItem('cartCounter', counter);
    //var 
    return {
        checkout : function(){
        },
        addToCart : function(gruopid){
            counter++;
            return counter;
        },
        getCartCounter : function(){
            return counter;
        }
    };
});

你可以像

那样设置$scope.cartCounter的方法引用
$scope.cartCounter = cart.getCartCounter;

然后在HTML上，你可以调用像cartCounter()这样的方法，它将对每个摘要进行评估。

<i class="glyphicon glyphicon-shopping-cart" aria-hidden="true"></i> 
Cart({{cartCounter()}})

在控制器中使用$rootScope。所有的$scope都是$rootScope的子域。

decorpotCtrls.controller('ImageViewController', [
'$rootScope',
'$scope',
'$routeParams',
'imageView',
'$auth',
'cart',
function($scope,$rootScope, $routeParams, imageView, $auth, cart) {
$scope.addToCart = function(groupid) {
        $rootScope.counter++;
        console.log($auth.isAuthenticated());
        return cart.addToCart(groupid);
    };
} ]);
相关文章：