AngularJS $Broadcast 和 $on 不更新 $scope

我正在尝试使用用户的姓名更新主导航栏，并使用他购买的商品数量更新购物车图标。我以前没有尝试过使用 $broadcast 和 $on 。

成功登录后，我设置了一个简单的广播，这是在其自己的登录控制器中：

$rootScope.$broadcast('user-logged-in');

现在，我在购物车图标所在的控制器中有 $on 事件，但该值在登录时永远不会更新。事实上，我什至没有收到控制台消息，所以它永远不会到达它。

$scope.$on('user-logged-in', function  (event, args) {
            console.log("Broadcasted to Products Controller");
            $scope.logged= Session.isLogged();
            $scope.username= Session.recallName();
        });

学习如何使用它会非常有帮助，因为当其他视图中的数据发生变化时，我会在主视图上不断更新更多内容。如果有影响的话我会使用 UI-Router。

请记住，使用 $broadcast、$rootScope、$apply...（以及其他一些）在 AngularJS 中确实是不好的做法

这是一个关于如何在控制器之间共享值的干净解决方案：（在此工作plunker http://plnkr.co/edit/HfzoFN0QsMTtxcSb10gl?p=preview)

Routing

$urlRouterProvider.when("","/mainpage");

  $stateProvider
    .state('app', {
      abstract: true,
      templateUrl: "main.template.html",
      controller: "MainCtrl"
    }).state('app.mainpage', {
      url: "/mainpage",
      templateUrl: "mainView.html",
      controller:"PageCtrl"
    });

控制器中的绑定

angular.module('MyApp').controller('MainCtrl', function($scope, UserService){

    $scope.user = UserService.user;

});
angular.module('MyApp').controller('PageCtrl', function($scope, UserService){

    $scope.user = UserService.user;

});

Service

angular.module('MyApp').service('UserService', function(){

    var service = {};

    service.user = {};

    service.user.name = "Not connected";

    return service;

});

带标题的模板

<p>I'm the header welcome {{user.name}}</p>
<hr/>
<ui-view></ui-view>

最终视图

<p>I'm the view : User : {{user.name}}</p>
<input type="text" ng-model="user.name">
<button ng-click="user.name='Derp'">Change name to Derp</button>

我不介意你投票，选择这个作为答案或最终使用它。我只是希望您记住有关在控制器之间共享值的常见问题的最佳实践。

希望有帮助。