Javascript 来自外部文件的角度$md对话框控制器

我使用材料设计的md对话框，遇到了一个小问题，给我带来了很多麻烦

我将此对话框用作在db中创建新记录的表单，需要从外部文件加载其控制器。原因是我在应用程序的许多地方（在许多其他控制器中）使用相同的对话框，我不想将其复制并粘贴到每个位置

我曾尝试将其作为服务编写，但问题是，当我将数据从表单绑定到控制器时，我使用了$scope，这样就得到了“$scope未定义”。当我在该服务中添加$scope作为依赖项时，我得到了注入错误。 您是否知道如何从外部加载模态控制器，使其即使使用$scope也能正常工作

$scope.showNewContactDialog = function($event) {
            var parentEl = angular.element(document.body);
                $mdDialog.show({
                parent: parentEl,
                targetEvent: $event,
                templateUrl: 'app/Pages/directory/contacts/newContact.dialog.html',
                controller: NewCompanyContactDialogCtrl,
                clickOutsideToClose: true,
                hasBackdrop: true
            });  
        };

// New User dialog controller
        function NewCompanyContactDialogCtrl($scope, $mdDialog) {
            var self = this;
            $scope.modalIcon = "add";
            $scope.modalTitle = 'Nová položka';
            $scope.modalAdvanced = true;

            // Country Selector
            apiCalls.getData(countryUrl, function(response){
                $scope.countries = response;
            })

            // Add New Object
            $scope.newItem = function() {
                var url = baseUrl + 'new/';
                var data = JSON.stringify({
                    code: $scope.newItem.contactCode,
                    first_name: $scope.newItem.contactFirstName,
                    last_name: $scope.newItem.contactLastName,
                    street: $scope.newItem.contactStreet,
                    city: $scope.newItem.contactCity,
                    country: $scope.newItem.contactCountry,
                    postal: $scope.newItem.contactPostal,
                    pobox: $scope.newItem.contactPobox,
                    price_lvl: $scope.newItem.contactPriceLvl,
                    orgid: $cookies.get('orgid')
                });

                apiCalls.postData(url, data, function(response){
                    console.log(response);

                    // Toast
                    if(response.status == 201){
                        $mdToast.show(
                            $mdToast.simple()
                                .textContent('Záznam bol vytvorený.')
                                .position('bottom right')
                                .action('Skryť')
                                .highlightAction(true)
                                .highlightClass('md-warn')
                        );

                        $mdDialog.cancel();   
                    }
                });
            }

---

带有外部控制器的对话框示例：

$mdDialog.show({
    scope               : scope,
    preserveScope       : true,
    templateUrl         : 'template/search.html',
    targetEvent         : event,
    clickOutsideToClose : true,
    fullscreen          : true,
    controller          : 'DialogController'
});

angular.module('myApp').controller('someController',function($scope,newCompModal){
        $scope.newCompanyModalShow = newCompModal.show;        
})

和controller search.js：

(function() {

angular.module('myApp')
    .controller('DialogController', DialogController);

DialogController.$inject = ['$scope', '$mdDialog'];

function DialogController($scope, $mdDialog) {

    $scope.closeOpenedDialog  = closeOpenedDialog;

    function closeOpenedDialog() {
       $mdDialog.hide();
    }
}
})();

---

要使用as服务，您可以执行以下操作：

angular.module('myApp').factory('newCompModal', function($mdDialog){
        var parentEl = angular.element(document.body);

       function show($event){
            return  $mdDialog.show({
                parent: parentEl,
                targetEvent: $event,
                templateUrl: 'app/Pages/directory/contacts/newContact.dialog.html',
                controller: 'NewCompanyContactDialogCtrl',
                clickOutsideToClose: true,
                hasBackdrop: true
            });

       }    
      return {
        show: show
      }    
});

然后在任何控制器中：

$mdDialog.show({
    scope               : scope,
    preserveScope       : true,
    templateUrl         : 'template/search.html',
    targetEvent         : event,
    clickOutsideToClose : true,
    fullscreen          : true,
    controller          : 'DialogController'
});

angular.module('myApp').controller('someController',function($scope,newCompModal){
        $scope.newCompanyModalShow = newCompModal.show;        
})

并从视图中传递事件

<button ng-click="newCompanyModalShow($event)">New Company</button>

新公司

---

如果您还需要将数据从控制器传递到模式，您可以添加另一个参数并将其传递到

$mdDialog

的

locals

属性，或者通过另一个服务属性进行共享，如果您的mdDialog配置由于属于外部文件而无法识别您的控制器名称，则可以不执行此操作：

controller          : 'DialogController'

您应该在对话框的视图中将控制器作为指令加载：

<md-dialog ng-controller="DialogController">
...
</md-dialog>

...

请出示您的代码。您还可以使用

locals

将数据解析传递给对话框控制器。问题本身应包含代码。您可以随时更新问题只要将

ng controller=“YourController”

添加到对话框模板`@JakubMana您是否尝试过任何给定的答案，请尝试一下，现在就告诉我们。关于我的答案，我已经用过了，我知道它是有效的。