javascript - 如何从另一个angularjs刷新一个 Controller 的计数器值

标签 javascript angularjs angularjs-scope angularjs-service angularjs-controller

我有一个购物车计数器,位于 header Controller 中。以及 ImageView Controller 中的“添加到购物车”按钮。我想从 ImageView Controller 设置购物车计数器。因此,每次单击添加到购物车时,都会更改购物车值(value)。

标题 Controller :

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

图像 Controller :-

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

从图像 Controller 添加到购物车 -

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

关于javascript - 如何从另一个angularjs刷新一个 Controller 的计数器值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32033057/

相关文章:

angularjs - 当 AngularJS 中的范围发生更改时刷新 Controller 中的数据

javascript - 仅在Blur 上使用 mwl-confirm 指令

javascript - 带有 Angular 的 Rails - uiView 未定义

javascript - 从滚动事件监听器 react setState 钩子(Hook)

javascript - jquery遍历DOM寻找连续值

javascript - angular如何定义css

javascript - Angular - 更新模板中的徽章编号

javascript - 当元素在 angularjs 中显示或隐藏时,如何在指令中获取监视函数来触发

javascript - 使用 Jquery 检查 Javascript 对象中是否存在某些内容

javascript - 在 JavaScript 中匹配返回 null