javascript - 如何在 $mdDialog 中添加表单

Question

如何在 $mdDialog 中添加表单以及提交时如何发送到电子邮件。我试图从对话框中获取信息，但找不到任何线索。

我的 Controller 是:

App.controller('MainController', function ($scope, $mdDialog) {
console.log("reaching mainController");
$scope.showPrompt = function (ev) {
    console.log("reaching showprompt");
    // Appending dialog to document.body to cover sidenav in docs app
    var confirm = $mdDialog.prompt()
        .title('Please give us your details')
        .textContent('We are happy to quote for your interiors in your new home.')
        .placeholder('Name')
        .ariaLabel('Dog name')
        .initialValue('')
        .placeholder('Name')
        .ariaLabel('Dog name')
        .initialValue('')
        .targetEvent(ev)
        .ok('Submit')
        .cancel('Later');

    $mdDialog.show(confirm).then(function (result) {
        $scope.status = 'You decided to name your dog ' + result + '.';
    }, function () {
        $scope.status = 'You didn\'t name your dog.';
    });
};

我想在页面加载时显示对话框，并且我已在 ng-init 中添加了该功能

    <div ng-controller="MainController" ng-init="showPrompt($event)">

模态正在按加载时间迅速加载。我是不是哪里出错了？

Answer 1

最好的方法是使用“templateUrl”，您可以放置​​ html 文件的 url 并执行您想要的操作，或者使用“template”作为内联 html。

https://material.angularjs.org/latest/api/service/ $mdDialog

$mdDialog.show({
          targetEvent: $event,
          template:
            '<md-dialog>' +

            '  <md-dialog-content>Hello {{ employee }}!</md-dialog-content>' +

            '  <md-dialog-actions>' +
            '    <md-button ng-click="closeDialog()" class="md-primary">' +
            '      Close Greeting' +
            '    </md-button>' +
            '  </md-dialog-actions>' +
            '</md-dialog>',
          controller: 'GreetingController',
          onComplete: afterShowAnimation,
          locals: { employee: $scope.userName }
        });