Question

我对AngularJS材质的$ mdDialog函数有些麻烦。 就是这样：
1）对API的HTTP.get请求并将数据保存到$ scope
中 2）ng-repeat on view for table
3）用户可以点击一行并显示模态（这是问题）
4）点击行的数据将以模态显示为标题

正如您可以看到我的AngularJS控制器代码：

 $scope.showAdvanced = function(ev, variable_name) {
        console.log(variable_name);
        $mdDialog.show({
            locals:{dataToPass: variable_name},
            templateUrl: 'save-dialog.tmpl.html',
            parent: angular.element(document.body),
            targetEvent: ev,
            clickOutsideToClose:true,
            isolateScope: false,
            controller: DialogController

        })
            .then(function(answer) {
                $scope.status = 'You said the information was "' + answer + '".';
            }, function() {
                $scope.status = 'You cancelled the dialog.';
            });
        function DialogController($scope, $mdDialog) {

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

            $scope.cancel = function() {
                $mdDialog.cancel();
            };

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

我在控制台中收到的错误消息是这样的（仅当我在controller: DialogController中添加行$mdDialog.show时才会发生这种情况，并且我正在遵循文档权限：

文档：https://material.angularjs.org/latest/demo/dialog

variable_name只是我从点击的行中获得的变量，如果有人有任何更好的解决方案请告诉。模态的目的是在模态中写入一些数据，然后单击提交，将数据发送到DB。

这是错误消息：

main.min.js:3 Error: [$injector:unpr] Unknown provider: tProvider <- t
http://errors.angularjs.org/1.5.11/$injector/unpr?p0=tProvider%20%3C-%20t
    at main.min.js:2
    at main.min.js:2
    at Object.r [as get] (main.min.js:2)
    at main.min.js:2
    at r (main.min.js:2)
    at i (main.min.js:2)
    at Object.a [as invoke] (main.min.js:2)
    at c.instance (main.min.js:3)
    at o._createController (main.min.js:17)
    at Object.i [as link] (main.min.js:17)

Answer 1

使用匿名控制器可以解决您的问题。

 $scope.showAdvanced = function(ev, variable_name) {
        console.log(variable_name);
        $mdDialog.show({
            locals:{dataToPass: variable_name},
            templateUrl: 'save-dialog.tmpl.html',
            parent: angular.element(document.body),
            targetEvent: ev,
            clickOutsideToClose:true,
            isolateScope: false,
            controller: function($scope, $mdDialog) {

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

              $scope.cancel = function() {
                  $mdDialog.cancel();
              };

              $scope.answer = function(answer) {
                  $mdDialog.hide(answer);
              };
          }
        }).then(function(answer) {
                $scope.status = 'You said the information was "' + answer + '".';
            }, function() {
                $scope.status = 'You cancelled the dialog.';
        });
    };

关于你的dataToPass，你也需要注射它。

function($scope, $mdDialog, dataToPass){
    console.log(dataToPass) // Working
}

Answer 2

md-dialog需要一个角度控制器。

你必须将你的控制器功能注册为真正的角度控制器（在showAdvance函数范围之外也可能有意义）

所以......这样做

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

并且在对话框配置中它需要是一个字符串，所以

$mdDialog.show({
    locals:{dataToPass: variable_name},
    templateUrl: 'save-dialog.tmpl.html',
    parent: angular.element(document.body),
    targetEvent: ev,
    clickOutsideToClose:true,
    isolateScope: false,
    controller: 'DialogController'
})

将数据传递给AngularJS mddialog错误

2 个答案: