angular 等待父控制器

Question

我有一个 angular 应用程序和几个模块。
正如您在下面看到的，我在 mod2 中调用了一个指令，位于 mod1template.html.
myvar 在 mod1Ctrl
中获取值但是 angular 首先初始化 child 并且 myvar 在 mod2 的控制器中显示为空。
当我用谷歌搜索时，有一些解决方案，但对我的情况没有任何帮助。
pre post 链接适用于父子都是指令但我的 mod1 没有任何指令的情况。
我不想将参数作为属性传递

我的情况还有其他解决方案吗？

mod1template.html:
<div>
<mod2-dir></mod2-dir>
</div>

angular.module("angApp.mod1", ["ngRoute"])
    .config(["$routeProvider", "$locationProvider", function ($routeProvider, $locationProvider) {
        $routeProvider.when("/:myvar1/:myvar2\_:id", {
            templateUrl: "Angular/mod1template.html",
            controller: "mod1Ctrl"
        });

    }])
    .controller("mod1Ctrl", ["$routeParams", "$scope", "mod1DataService", function ($routeParams, $scope, mod1DataService) {
        $scope.myvar = mod1DataService.myvar;
        }

angular.module("angApp.mod2", ["ngRoute"])
    .directive("mod2Dir", function () {
        return {
            restrict: "E",
            templateUrl: "Angular/mod2template.html",
            controller: "mod2Ctrl"
        };
    })
    .controller("mod2Ctrl", ["$scope", function ($scope) {
        alert($scope.myvar.Id);
        }

Answer 1

尝试在 mod2Ctrl 中使用 $timeout:

而不是

alert($scope.myvar.Id);

使用这个

$timeout(function(){
    alert($scope.myvar.Id);
},1);

Answer 2

您可以在您的情况下使用 $broadcast。当 $scope.myvar 值改变时，watch 会触发广播事件，它会被它的子作用域监听。

angular.module("angApp.mod1", ["ngRoute"])
    .config(["$routeProvider", "$locationProvider", function ($routeProvider, $locationProvider) {
        $routeProvider.when("/:myvar1/:myvar2\_:id", {
            templateUrl: "Angular/mod1template.html",
            controller: "mod1Ctrl"
        });

    }])
    .controller("mod1Ctrl", ["$routeParams", "$scope", "mod1DataService", function ($routeParams, $scope, mod1DataService) {
        $scope.myvar = mod1DataService.myvar;
        //asuming that service call is ajax that's why placing watch on on myvar
        $scope.$watch('myvar', function(newVal, oldVal){
          if(newVal != oldVal)
             $scope.$broadcast('parentControllerLoaded',newVal); //no need to use broadcast event using $rootScope
        },true);
    }



angular.module("angApp.mod2", ["ngRoute"])
    .directive("mod2Dir", function () {
    return {
       restrict: "E",
       templateUrl: "Angular/mod2template.html",
       controller: "mod2Ctrl"
   };
})
.controller("mod2Ctrl", ["$scope", function ($scope) {
    $scope.$on('parentControllerLoaded',function(event, data){
        alert(data.id);
        //you can directly access parent scope from here.
        //alert($scope.$parent.myvar.Id)
    });
}

angular 等待父控制器

angular wait for parent controller

parent-child

angularjs

angularjs-directive

angularjs-routing

angularjs-module