问AngularJS材料-使用电话“后退”按钮关闭对话框
EN

Stack Overflow用户

提问于 2015-02-18 13:46:39

回答 3查看 3.6K关注 0票数 3

溢出！

我是第一次建立一个棱角材料网站，我似乎有一个问题与对话框的功能。我可以让盒子显示和关闭罚款，除非在移动设备。即当用户在手机上按下“清除”或“后退按钮”时。当您这样做(或单击浏览器上的“后退”按钮)时，它对对话框没有影响。它仍然存在，并等待输入。按ESC键关闭它。任何打电话的人都会本能地认为他们可以摆脱它，在我看来，他们应该这样做。我尝试过各种各样的方法，要么不起作用，要么我只是没有正确地实施它们。那么，就这样..。

主计长：

'use strict'; 
app.controller('NavCtrl', function ($scope, $mdDialog) {    
$scope.itworked = "Angular Successful";
var dialogContent = ' \
    <md-content> \
      <div class="diagtest">Content</div> \
        <p class="awesome"><a href="#/" ng-click="hide()">This link works</a></p> \
        <p><a href="#/portfolio" ng-click="hide()">This link also works</a></p> \
        <p>filler</p> \
    </md-content> \
';
var noForm = '<md-dialog id="navDialog">' + dialogContent + '</md-dialog>';
var formAround = '<form ng-submit="hide()"><md-dialog>' + dialogContent + '</md-dialog></form>';
var formInside = '<md-dialog><form ng-submit="hide()">' + dialogContent + '</form></md-dialog>';

function makeDialog(tmpl) {
    return function(ev) {
        $mdDialog.show({
            template: tmpl,
            targetEvent: ev,
            controller: 'DialogController'
        });
    };
}
$scope.dialogNoForm = makeDialog(noForm);
$scope.dialogFormAround = makeDialog(formAround); \\ This is for future use
$scope.dialogFormInside = makeDialog(formInside); \\ so is this...
});
app.controller('DialogController', function($scope, $mdDialog) {
$scope.hide = function() {
    $mdDialog.hide($scope.participant);
};
$scope.cancel = function() {
    $mdDialog.cancel();
};
});

任何人提出的任何建议我都愿意尝试。

我尝试了以下几点：

setCancellable(true)

还尝试使用“导航”技巧关闭对话框，如果按下后退按钮，但它只是不能工作。

您可以看到一个在正式文档站点上具有相同功能的示例。如果您检查对话框，您可以看到它们的功能是完全相同的。

https://material.angularjs.org/#/demo/material.components.dialog

它们的写作方式有点不同，但它们在桌面和手机上的表现与我的相同。

预先感谢任何人谁能提供光明！我很感激你！

javascript

android

angularjs

modal-dialog

angular-material

平台电商解决方案

为客户提供电商客服、电商图片系统识别及搜索的快速搭建方案

回答 3

Stack Overflow用户

回答已采纳

发布于 2016-01-17 14:45:29

我知道这个答案来得有点晚了。

我也有同样的问题，并能够通过利用路由事件来解决它。当路由更改时，关闭mdDialog

样本代码。app是在应用程序启动时注册的角应用程序代码。

function appRun($rootScope, $mdDialog) {

    $rootScope.$on('$stateChangeSuccess',
        function (event, toState, toParams, fromState) {

            //close any open dialogs
            $mdDialog.cancel();
        });

}

app.run(['$rootScope', '$mdDialog', appRun]);