Question

我无法通过按钮关闭模态，或者在模态外部单击以关闭窗口。我没有收到错误，使用简单的Controller或ControllerAs语法也遇到了同样的问题。

我的示例模态代码：

angular.module('MyApp').controller('TestCtrl', ["$scope", "$mdDialog",
    function($scope, $mdDialog) {

        var alert;
        $scope.showInfoModal = showGameInfoModal;

        // Internal method
        function showGameInfoModal(schedule) {
            $scope.schedule = schedule;

            alert = $mdDialog.show({
                clickOutsideToClose: true,
                disableParentScroll: true,
                escapeToClose: true,
                scope: $scope,        // use parent scope in template
                preserveScope: true,  // do not forget this if use parent scope

                // Since GreetingController is instantiated with ControllerAs syntax
                // AND we are passing the parent '$scope' to the dialog, we MUST
                // use 'vm.<xxx>' in the template markup
                templateUrl: 'Modules/Test/Test2.html',
                controller: function DialogController($scope, $mdDialog) {
                    $scope.closeDialog = function() {
                        $mdDialog.hide();
                    };
                },
                controllerAs: 'dc'
            });

        }

    }
]);

然后是Partials HTML：

<md-content>
    <md-toolbar flex layout="row" layout-align="center">
        <h5>{{schedule.GameDate</h5>
    </md-toolbar>
    <section layout="column" layout-align="center">
        <div ng-init="coords={latitude: false, longitude: false}">
            <gm-map options="{center: [43.6576221, -79.607505], zoom: 13, mapTypeId: google.maps.MapTypeId.ROADMAP}">
                <gm-marker options="{position: [43.6576221, -79.607505], draggable: false}">
                    <gm-infowindow options="{content: 'Max Ward 2'}"></gm-infowindow>
                </gm-marker>
            </gm-map>
        </div>
    </section>

    <section>
        <div class="md-actions">
            <md-button ng-click="dc.closeDialog()" class="md-fab md-fab-bottom-right md-mini" aria-label="Close"><ng-md-icon icon="close"></ng-md-icon></md-button>
        </div>
    </section>
</md-content>

Answer 1

在搜索更多示例时，我发现我错过了<md-dialog>标记。

<md-dialog aria-label="Game Info and Map">
    <md-content>
        <md-toolbar flex layout="row" layout-align="center">
            ...
        </md-toolbar>
    </md-content>
</md-dialog>

Angular-Material无法使用按钮关闭$ mdDialog

1 个答案: