javascript - AngularJS:如何在初始化期间在 Controller 之间传递数据?

标签 javascript angularjs controller initialization

在我的 AngularJS 应用程序中,我有一个管理用户输入的 Controller (input controller) 并广播页面的每一个重大变化 content controller (实际上是内容部分由多个 Controller 管理,但让我们保持简单)。

输入 Controller 提供从数据库检索的各种元素之间的选择,在页面初始化时,我必须加载输入 Controller 数据并为内容 Controller 提供默认选择,以便它可以在页面加载时显示重要数据.

现在我在输入 Controller 初始化时拍摄一个事件 ($rootScope.$broadcast('inputSelected', inputData);) 但显然 angular 还没有初始化所以内容 Controller 没有' t 捕获事件并且不呈现实际内容页面。

我做了一个JSFiddle演示行为:

初始化时,第一个 Controller 使用初始数据向第二个 Controller 发送事件:

myApp.controller('FirstController', function ($scope, $rootScope) {
  $scope.myInput = 'Initial data';

  $scope.broadcast = function() {
    console.log ('broadcasting: ' + $scope.myInput);
    $rootScope.$broadcast('myEvent', $scope.myInput);
  };

  $scope.broadcast();
});

第二个 Controller 正在监听“myEvent”:

myApp.controller('SecondController', function ($scope) {
  $scope.$on('myEvent', function (event, args) {
    console.log ('myEvent catched - Data: ' + args);
    $scope.data = args;
  });
});

当页面加载时,第一个事件没有被第二个 Controller 捕获并且初始数据没有传递,然后如果你按下按钮 BROADCAST(angular 被初始化),一切正常。

那么最后一个问题:初始化时在 Controller 之间传递数据的最佳方法是什么?有没有办法确保在广播第一个事件之前完全初始化 Angular?

最佳答案

包装 $scope.broadcast();在 $scope.$evalAsync 中调用对我有用:

myApp.controller('FirstController', function ($scope, $rootScope) {
  $scope.myInput = 'Initial data';

  $scope.broadcast = function() {
    console.log ('broadcasting: ' + $scope.myInput);
    $rootScope.$broadcast('myEvent', $scope.myInput);
  };

   $scope.$evalAsync( function() { 
     $scope.broadcast();
   });
});

另见:https://stackoverflow.com/a/23589271/1288109

请参阅有关 $evalAsync 的文档:https://docs.angularjs.org/api/ng/type/$rootScope.Scope#$evalAsync

关于javascript - AngularJS:如何在初始化期间在 Controller 之间传递数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37132919/

相关文章:

angularjs - 在 Angular 2 中发送帖子时出错

c# - 在 MVC 中将值从 Controller 传递到 View

javascript - 如何将表单中的 Json 发布到 Controller 然后保存到数据库

javascript - 使用 insertAdjacentHTML 在 .js 文件中给出错误,但在控制台代码段中没有给出错误

javascript - 基于先前选择的动态选择框

javascript - 响应式画廊对齐问题(Bootstrap-gallery & justifyGallery)

javascript - React Router v4 Router 组件中的所有内容都会在每次路由更改时重新呈现

angularjs - .net Core MVC : X-SRF-TOKEN not accepted, 400 返回

javascript - 我可以在 Angular Controller 中使用插值(不仅仅是在 HTML 中)吗?

asp.net-mvc - 从业务层使用邮政库