Md 对话框未加载与其关联的控制器

Md-dialog not loading the controller associated with it

本文关键字：关联 控制器 对话框 加载 Md      更新时间：2023-09-26

我正在尝试在单击按钮时在角度js1.5中加载md-dialog，我看到的只是模态弹出窗口中的html标记，而不是该组件的控制器加载。以下是我用于显示 md 对话框的标记调用对话框的文件

 $mdDialog.show ({
        template: require('../traderdialog/traderdialog.html'),
        controller: Controller,
        controllerAs: 'vm',
        locals : {
            traderId : traderId
        },
        clickOutsideToClose : true
        });
    }

所以当我做控制器：控制器时，它会转到不同的组件，就像我在目录结构中一样。我的交易者对话框代码.js如下 

 angular.module('dashboard')
.component('traderdialog', {
    template: require('./traderdialog.html'),
    controller: Controller,
    controllerAs: 'vm',
    bindings: {
    }
});
function Controller( $mdDialog) { *some code* }

$mdDialog.show ({
        template: require('../traderdialog/traderdialog.html'),
        controller: function ControllerName($scope){
                    $scope.data = "Controller Loaded";
         },
        locals : {
            traderId : traderId
        },
        clickOutsideToClose : true
        });
    }

或

 $mdDialog.show ({
            template: require('../traderdialog/traderdialog.html'),
            controller: controllerName,
            locals : {
                traderId : traderId
            },
            clickOutsideToClose : true
            });
        }
    function controllerName($scope){
                        $scope.data = "Controller Loaded";
             }

在 mdDialog 中使用控制器有两种方法，其中一种方法是与保留范围内的父级使用相同的作用域：

$mdDialog.show({
          controller: function () {
            return self;
          },
          templateUrl: 'templates/mdDialog.html',
          parent: angular.element(document.body),
          targetEvent: ev,
          clickOutsideToClose: false,
          bindToController: true,
          scope: $scope,
          hasBackdrop: true,
          preserveScope: true
        });

另一个是与 controllerAs 属性一起使用，并初始化它：

$mdDialog.show({
        controller: DialogController,
        templateUrl: 'templates/mdDialog.html',
        parent: angular.element(document.body),
        targetEvent: ev,
        clickOutsideToClose: true,
        controllerAs: 'DlgCtrl',
        bindToController: true,
        locals: {
          formData: $scope.formData,
        }
      })

你可以用DlgCtrl.formData语法联系你的当地人。

您应该将所需的数据从父控制器注入到模态的作用域。当模态打开时，它有自己的范围。

$mdDialog.show ({
    template: require('../traderdialog/traderdialog.html'),
    controller: 'MyCtrl',
    locals : {
        traderId : traderId
    },
    clickOutsideToClose : true
    });
}

现在，让我们为您定义模态traderdialog.html控制器。

angular.module('app').controller('MyCtrl',['traderId', function(traderId){
    console.log(traderId);
}]);

现在traderId将反映在您的模态上。

相关文章：