Question

我正在学习AngularJs。我创建了一个表单，提交后将打开一个对话框，以验证给定的详细信息，该表单工作正常。
但是当我关闭模式框时，我得到的异常很少：

index.jsp
-------------

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Home | Page</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.2/angular.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/ng-dialog/1.4.0/js/ngDialog.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ng-dialog/1.4.0/css/ngDialog-theme-default.css">
<script src='<c:url value="/app.js"></c:url>'></script>
</head>
<body>
    <div  ng-app="myApp" ng-controller="myController">
        First Name:<input type="text" name="first" ng-model="first">
        <br>
        Last Name:<input type="text" name="last" ng-model="last">
        <br>
        <button ng-click="openDialog(first,last)">Dialog</button>
        <br>
        {{first}}
    </div>
</body>
</html>

dialog.html
----------------

<html>
<head>
<meta charset="ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
    <form name="dialog">
        First Name:<input type="text" name="fi" ng-model="first">
        <br>
        First Name:<input type="text" name="ls" ng-model="last">
        <br>
        <button ng-click="save(first,last)">Save</button>
    </form>
</body>
</html>

app.js
-----------

var app= angular.module("myApp",['ngDialog']);
    app.controller("myController",function($scope,ngDialog,$timeout){
        $scope.openDialog= function(first,last){
            $scope.Dialog= ngDialog.openConfirm({
                template: 'dialog.html',
                className: 'ngdialog-theme-default',
                scope: $scope,
                showClose: true
            })
        }

        $scope.save= function(first,last){
            alert(first+last+"saved");
            $scope.Dialog.close();
        }
    });

stacktrace
---------------

TypeError: $scope.Dialog.close is not a function
Possibly unhandled rejection: $closeButton

Answer 1

openConfirm（）打开一个对话框，默认情况下，单击转义或在对话框窗口外部单击时不会关闭。该函数返回一个承诺，可以根据对话框的关闭方式来解决它。

var app = angular.module("myApp", ['ngDialog']);
app.controller("myController", function ($scope, ngDialog, $timeout) {
    $scope.openDialog = function (first, last) {
        $scope.Dialog = ngDialog.openConfirm({
            template: 'dialog.html',
            controller: ['$scope', function ($scope) {
                $scope.first = first;
                $scope.last = last;
                $scope.save = function (first, last) {
                    alert(first + last + "saved");
                }
            }],
            className: 'ngdialog-theme-default',
            scope: $scope,
            showClose: true
        }).then(function (success) {
            alert(success);
        });
    }
});

Answer 2

问题在于openConfirm()返回一个约定，而不是像open()这样的对象。因此，如果要返回对象，则应使用open()而不是openConfirm()。选中ngDialog GitHub

AngularJs-在关闭对话框时获取未处理的拒绝

2 个答案: