$mdDialog.confirm() 与自定义 templateUrl

Question

我在我的应用程序中使用 $mdDialog，但想将它用作 "confirm" 对话框而不是普通对话框。这意味着，在用户单击确认对话框中的两个按钮之一之前，代码流不应继续。我注意到 $mdDialog.confirm() 可以使用，但我不确定如何将它与自定义 templateUrl 和相应的控制器一起用作对话框的内容。

以下是我编写的内容，就对话框而言工作正常，但代码流在对话框打开后不会停止。它应该停止，直到用户单击“确定”或“取消”。

$mdDialog.show({
      controller: 'incomingCallDialogController',
      templateUrl: 'app/components/others/incomingCallDialog/incomingCallDialog.tpl.html',
      locals: {message: message},
      parent: angular.element(document.body)
   }).then(function (answer) {
      console.log("here");
   }

Answer 1

基本上是这样的：

var confirm = $mdDialog.confirm({
      controller: 'incomingCallDialogController',
      templateUrl: 'app/components/others/incomingCallDialog/incomingCallDialog.tpl.html',
      locals: {message: message},
      parent: angular.element(document.body)
   })
   $mdDialog.show(confirm).then(function() {
      console.log("here");
   }

这是一个codepen。

Answer 2

Angular Js 使用 Matrial Ui 和 icon/images

确认对话框设计

Screenshot : https://i.stack.imgur.com/rghwX.png

Online demo : https://codepen.io/MuhammadRizwan/pen/aYBKqW?editors=1010

Answer 3

试试这个

                $scope.showTimContent = function (tim) {
                    $mdDialog.show({
                        controller: ['$scope', '$mdDialog', 'tim', $scope.ViewTimContentCtrl],
                        templateUrl: 'wgt/tim/TimContentDialog.html',
                        locals: {'tim': tim},
                        clickOutsideToClose: true,
                    });
                };

                $scope.ViewTimContentCtrl = function ($scope, $mdDialog, tim) {
                    $scope.tim = tim;
                    $scope.hide = function () {
                        $mdDialog.hide();
                    };
                    $scope.cancel = function () {
                        $mdDialog.cancel();
                    };
                };

$mdDialog.confirm() 与自定义 templateUrl

$mdDialog.confirm() with custom templateUrl

angularjs

material-design

angular-material