AngularJS

Question

在我的网站上我有以下结构

Header_controller:

myApp.controller('Header_controller',function($scope,$rootScope,$location,Genral_model){

    $scope.logout = function(){
        var data = {};
        $rootScope.$emit('logout_clicked', data);  // NOT WORKING
        $rootScope.$broadcast('logout_clicked', data); // NOT WORKING
    }

});

Users_controller:

myApp.controller('Users_controller', function ($scope,$rootScope,Users_model,$location,$state) {

    $rootScope.$on('logout_clicked', function(event, resp) {
        Users_model.unRegisterCookies();
    });
})

Users_model:

myApp.factory('Users_model', function($rootScope,$http,$cookies) {
  var factory={};

  factory.unRegisterCookies = function(){
      alert('log out');
  }


  return factory;
});

我正在尝试通过从 Header_controller 向 Users_controller 发送广播来调用 unRegisterCookies 函数，但它不适用于发射，也不适用于广播。

如何实现？

Answer 1

这与您正在尝试的基本代码相同，并且对我有效。也许您的代码中的其他地方有错误？

http://plnkr.co/edit/SADWwkZWztoVJVjv0tKt

html:

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.0.x" src="https://code.angularjs.org/1.2.28/angular.js" data-semver="1.2.28"></script>
    <script src="app.js"></script>
  </head>

  <body>
    <div ng-controller="HeaderCtrl">
      <p>Button has been hit {{counter}} times.</p>
    </div>
    <div ng-controller="UsersCtrl">
      <button ng-click="pushme()">Count Me In</button>
    </div>

  </body>
</html>

脚本：

var app = angular.module('plunker', []);

app.controller('HeaderCtrl', function($scope, $rootScope) {
  $scope.counter = 0;

  $rootScope.$on('countMeIn', function (event, data) {
    $scope.counter = $scope.counter + 1;
  });

});


app.controller('UsersCtrl', function($scope, $rootScope) {

  $scope.pushme = function() {
    $rootScope.$emit("countMeIn", {});
  };

});

Answer 2

请参阅此 plnkr 以了解您的代码的工作版本：

http://plnkr.co/edit/JN5yWBUjmjBh5m7FiQww

这与您发布的代码完全相同，并且可以正常工作。您的页面中可能还有其他错误。如果您使用的是 Chrome 或 FireFox，请打开控制台并查看您的页面显示的错误。

html:

<!DOCTYPE html>
<html ng-app="myApp">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="angular.js@1.0.x" src="https://code.angularjs.org/1.2.28/angular.js" data-semver="1.2.28"></script>
    <script data-require="angular.js@1.0.x" src="https://code.angularjs.org/1.2.28/angular-cookies.js" data-semver="1.2.28"></script>
    <script src="app.js"></script>
  </head>

  <body>
    <div ng-controller="HeaderCtrl">
      <h1>Headers Controller</h1>
      <button ng-click="logout()">Log out</button>
    </div>
    <div ng-controller="UsersCtrl">
      <h1>Users Controller</h1>
    </div>

  </body>
</html>

脚本：

var myApp = angular.module('myApp', ['ngCookies']);

myApp.controller('HeaderCtrl', function($scope, $rootScope) {

  $scope.logout = function(){
      var data = {};
      $rootScope.$emit('logout_clicked', data);  // NOT WORKING
      $rootScope.$broadcast('logout_clicked', data); // NOT WORKING
  }  

});

myApp.controller('UsersCtrl', function($scope, $rootScope, Users_model) {

  $rootScope.$on('logout_clicked', function(event, resp) {
      Users_model.unRegisterCookies();
  });

});

myApp.factory('Users_model', function($rootScope,$http,$cookies) {
  var factory={};

  factory.unRegisterCookies = function(){
      alert('log out');
  }


  return factory;
});

AngularJS - 控制器通信

AngularJS - controllers communication

controller