Angular Material - 多个 $mdDialog 的嵌套控制器 windows - 不工作

Question

我不知道我是否只是犯了一个愚蠢的错误（为此我提前道歉）。或者我在 AngularJS 逻辑方面缺少一些东西。所以，我有一个自定义的 $mdDialog，它是通过按下按钮触发的。从这个 $mdDialog，我需要打开 2 个不同的 $mdDialog windows，具体取决于用户所做的选择。这在将控制器嵌套在同一个父控制器中时效果很好（因为我正在使用 $mdDialog，所以我有很多控制器）。

一旦我想拆分这些控制器以实现代码可管理性，我就无法将它们重新注入父控制器，并且 AngularJS 给我一个 Unknown Provider 错误. 这是我的索引文件，其中包含指向主模块和控制器的链接：

<script src="js/app.js"></script>
<script src="js/controllers/AppController.js"></script>
<script src="js/controllers/DatePickController.js"></script>

Angular模块：

angular.module('demoApp', ['ngMaterial']);

"parent controller"（触发第一个 $mdDialog window）：

angular
    .module('demoApp')
    .controller('AppController', ['$scope', '$mdDialog', 'DatePickController', 
    function($scope, $mdDialog, DatePickController){
        $scope.showConfirm = function(event) {
                  $mdDialog.show({
                         targetEvent: event,
                         templateUrl: 'templates/mainDialogTemplate.html',
                         controller: function($scope, $mdDialog, employee){
                         $scope.employee = employee;
                         $scope.closeDialog = function(){$mdDialog.hide();}
                         $scope.pickDate = function(){$mdDialog.show({
                                templateUrl:'templates/calendarDialogTemplate.html',
                                parent: angular.element(document.body),
                                clickOutsideToClose: true,
                                controller: 'DatePickController'
            })
         }
      },
        locals: {employee: $scope.userName}
     })
   };
}])

和 "child" 控制器： angular .module('demoApp') .controller('DatePickController', ['$scope', '$mdDialog', function($scope, $mdDialog){ $scope.cancel = 函数(){$mdDialog.cancel();} $scope.months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug'、'Sep'、'Oct'、'Nov'、'Dec']；

    //Open existing scorecard
    $scope.openScorecard = function(){$mdDialog.show({
        templateUrl: 'templates/scorecard.tmpl.html',
        parent: angular.element(document.body),
        clickOutsideToClose: true,
            controller: function($scope, $mdDialog) {
            $scope.cancel = function(){
                $mdDialog.cancel();
            }

            $scope.selectMonth = function(){
                $scope.editState = false;
                $http({
                    method: 'POST',
                    url: 'php/saveComments.php',
                    data : employee
                })
            }

            $scope.save = function(){
                $scope.editState = false;
                $http({
                    method: 'POST',
                    url: 'php/saveComments.php',
                    data : employee
                })
            }

            $scope.hide = function(){
                $mdDialog.hide();
            }
        }
     })
   }
}])

所以怎么了？

Answer 1

您不需要注入控制器。当您使用 angular.controller('name', function() {...}) 声明它们时，您指定了一个名称。现在您只需使用名称来判断对话框正在使用哪个控制器。

您已经在使用对话框控制器的名称 'DatePickController'。您的 DatePickController 函数参数未被使用，只需将其删除即可。注意区别，一个是字符串，一个是参数名

Angular Material - 多个 $mdDialog 的嵌套控制器 windows - 不工作

Angular Material - nested controllers for multiple $mdDialog windows - not working

controller

nested

angularjs

angular-material