对于想了解如何在AngularJS中停止$broadcast事件？的读者，本文将是一篇不可错过的文章，我们将详细介绍angular关闭当前页面，并且为您提供关于angularbroadcastemit

对于想了解如何在AngularJS中停止$broadcast事件？的读者，本文将是一篇不可错过的文章，我们将详细介绍angular关闭当前页面，并且为您提供关于angular broadcast emit 事件触发与事件广播、AngularJS $on、$emit和$broadcast的使用、AngularJS $ rootScope$ broadcast在app.run中不起作用、AngularJS $ rootScope。$ broadcast在app.run中不起作用的有价值信息。

• 如何在AngularJS中停止$broadcast事件？（angular关闭当前页面）
• angular broadcast emit 事件触发与事件广播
• AngularJS $on、$emit和$broadcast的使用
• AngularJS $ rootScope$ broadcast在app.run中不起作用
• AngularJS $ rootScope。$ broadcast在app.run中不起作用

如何在AngularJS中停止$broadcast事件？（angular关闭当前页面）

$emit: function(name,args) {
    // ....
    event = {
        name: name,targetScope: scope,stopPropagation: function() {
            stopPropagation = true;
        },preventDefault: function() {
            event.defaultPrevented = true;
        },defaultPrevented: false
    },// ....
}

$broadcast: function(name,args) {
    // ...
    event = {
        name: name,targetScope: target,// ...
}

angular broadcast emit 事件触发与事件广播

关于angular的事件处理有很多种方式，那么今天来介绍一下用的最多的广播和触发两种方式。。。。。

其实来看代码的话，你会发现很简单，无非就是

$scope.$emit('name','msg');

或者是

$scope.$broadcast('name','msg');

那么第一种就是事件触发啦，第二种就是事件广播了，那么这两者之间有啥区别呢？

其实从字面上来看就好很理解了，emit其实就是事件的触发，将一件事情发送出去，再简单的说就是把一件东西扔出去，，，

所以这里他是不会去管谁来接收的，他也不会去关心谁来收，但是这种接收只是针对one for one 的，

那么我们要用到one for more怎么办呢？那就用broadcaset啦，它的字面意思就是广播，将一个事件广播出去，

针对这些事件，我们都是用

$scope.$on('name',function(event,msg){
//dosomething
});

AngularJS $on、$emit和$broadcast的使用

AngularJS中的作用域有一个非常有层次和嵌套分明的结构。其中它们都有一个主要的$rootScope(也就说对应的Angular应用或者ng-app)，然后其他所有的作用域部分都是继承自这个$rootScope的，或者说都是嵌套在主作用域下面的。很多时候，你会发现这些作用域不会共享变量或者说都不会从另一个原型继承什么。

那么在这种情况下，如何在作用域之间通信呢？其中一个选择就是在应用程序作用域之中创建一个单例服务，然后通过这个服务处理所有子作用域的通信。

在AngularJS中还有另外一个选择：通过作用域中的事件处理通信。但是这种方法有一些限制；例如，你并不能广泛的将事件传播到所有监控的作用域中。你必须选择是否与父级作用域或者子作用域通信。

$on、$emit和$broadcast使得event、data在controller之间的传递变的简单。

1. $emit只能向parent controller传递event与data
2. $broadcast只能向child controller传递event与data
3. $on用于接收event与data
   

例子如下

html代码

<div ng-controller="ParentCtrl">        <!--父级-->
  <div ng-controller="SelfCtrl">       <!--自己-->
    <a ng-click="click()">click me</a>
    <div ng-controller="ChildCtrl"></div>  <!--子级-->
  </div>
  <div ng-controller="BroCtrl"></div>     <!--平级-->
</div>

js代码

app.controller(''SelfCtrl'', function($scope) {
  $scope.click = function () {
    $scope.$broadcast(''to-child'', ''child'');
    $scope.$emit(''to-parent'', ''parent'');
  }
});

app.controller(''ParentCtrl'', function($scope) {
  $scope.$on(''to-parent'', function(event,data) {
    console.log(''ParentCtrl'', data);    //父级能得到值
  });
  $scope.$on(''to-child'', function(event,data) {
    console.log(''ParentCtrl'', data);    //子级得不到值
  });
});

app.controller(''ChildCtrl'', function($scope){
  $scope.$on(''to-child'', function(event,data) {
    console.log(''ChildCtrl'', data);     //子级能得到值
  });
  $scope.$on(''to-parent'', function(event,data) {
    console.log(''ChildCtrl'', data);     //父级得不到值
  });
});

app.controller(''BroCtrl'', function($scope){ 
  $scope.$on(''to-parent'', function(event,data) { 
    console.log(''BroCtrl'', data);     //平级得不到值 
  }); 
  $scope.$on(''to-child'', function(event,data) { 
    console.log(''BroCtrl'', data);     //平级得不到值 
  }); 
});

最终结果

ParentCtrl parent

ChildCtrl child

$emit和$broadcast可以传多个参数，$on也可以接收多个参数。

在$on的方法中的event事件参数，其对象的属性和方法如下

感觉比service在不同controller中通信要方便许多~~

 以上就是对 AngularJS $on、$emit和$broadcast的资料整理，后续继续补充相关资料，谢谢大家对本站的支持!

AngularJS $ rootScope$ broadcast在app.run中不起作用

myApp.run(['AuthDataSvc','$rootScope',function (AuthDataSvc,$rootScope) {    
    AuthDataSvc.getAuth().then(function(Token){
        $rootScope.$broadcast('Token',Token);
    },function(status){
        console.log(status);
    });     
}]);

AngularJS $ rootScope。$ broadcast在app.run中不起作用

我在AngularJS
.run下有以下代码，该代码在我的本地开发计算机上可以正常运行，但在上传到客户端服务器后将无法工作…经过几次测试，很明显，在加载控制器时，事件并未尚未触发，因此取决于此事件的控制器中的大多数功能均无法正常工作。有人可以告诉我我在做什么错以及如何解决吗？谢谢

myApp.run([''AuthDataSvc'', ''$rootScope'', function (AuthDataSvc, $rootScope) {        AuthDataSvc.getAuth().then(function(Token){        $rootScope.$broadcast(''Token'', Token);    }, function(status){        console.log(status);    });     }]);

答案1

你总是要有一个比赛条件。我可以选择几种替代方法：

1）使用服务。我并不是这个选项的忠实支持者，因为它会导致产生Spaghetti代码。大多数情况下，您不希望控制器在登录之前运行。我喜欢选项2。

 myApp.run([''AuthDataSvc'', ''$rootScope'', function (AuthDataSvc, $rootScope) {        AuthDataSvc.getAuth(); /* no op we will use the service to determine logged in */}]);/* inside a controller */if(AuthDataSvc.isLoggedIn()){      //do something.}

2）使用route.resolve。解析是在路由上定义的，并且只有在将诺言设置为已解析后，Controller才会加载。我为您展示了一个示例ui-router，ng-route您需要选择毒药。如果您不使用ui-router，则应考虑使用。

/* app.config ... route config.. */var waitForLogon = {      UserToken: ["AuthDataSvc", function (AuthDataSvc) {         return AuthDataSvc.logon();      }]};//this is for ng-route $routeProvider   .when(''/Book/:bookId'', {      templateUrl: ''--'',      controller: ''MyCtrl'',      resolve: waitForLogon   })//this is for ui-router $stateProvider     .state(''me'', {            templateUrl: ''--'',            controller: ''MeCtrl'',            resolve: waitForLogon })

/* controller */ angular.module(''yourapp'')    .controller(''MyCtrl'', ["UserToken", ... , function(UserToken){                  //User Token will always be here when your Ctrl loads.   });

/* service code -- */angular.module(''yourapp'')    .service(''AuthDataSvc'', ["LogonModel", "$q", function(LogonModel, $q) {        this._q = null;        var that = this;        this._doAuth = function(){           this.getAuth().then(function(Token){ that._q.resolve(Token) }, function(error){that._q.reject(error);}        };        this.logon = function () {            if(!this._q){              this._q = $q.defer();               this._doAuth();// <-current auth do here, and resolve this._q when done            }            return this._q.promise;        };    });

今天关于如何在AngularJS中停止$broadcast事件？和angular关闭当前页面的讲解已经结束，谢谢您的阅读，如果想了解更多关于angular broadcast emit 事件触发与事件广播、AngularJS $on、$emit和$broadcast的使用、AngularJS $ rootScope$ broadcast在app.run中不起作用、AngularJS $ rootScope。$ broadcast在app.run中不起作用的相关知识，请在本站搜索。