javascript - Angular 模态返回 promise

Question

我想在用户执行操作(在本例中为删除)之前向用户显示一个弹出式警告模式。如果他们在模式中单击 okay，它将继续，如果他们单击 cancel，它将执行其他操作。

为此，我试图将模态 promise 沿链传递回初始调用 $rootScope.openDirections('warning').then(... 以便我可以决定在那里做什么。

但是我遇到了错误:

$rootScope.openDirections(...).then 不是函数 at Scope.$scope.deleteObj

告诉我 promise 没有被返回:

    $scope.deleteObj = function (id, type) {
        $rootScope.openDirections('warning').then(function (res) {
            // Do Stuff
        }, function (err) {
            console.log('ERROR', err);
        });

这调用了一个 $rootScope 函数:(我看到这里的对象类型是一个 promise...所以它现在不应该能够返回到原始调用者吗？)

    $rootScope.openDirections = function (type) {
        // A Promise: Object {result: Promise, opened: Promise, rendered: Promise}
        return Modal.showDirections(type);
    };

调用 Modal 工厂打开方向模式:

     return {
            ...
            showDirections: function(type) {   
                return $modal.open({
                    backdrop: 'static',
                    templateUrl: 'modal.html',
                    controller: 'directionsCtrl',
                    resolve: {
                        // Display custom modal template
                        obj: function () {
                            if (type === 'markdown') {
                                return {
                                    template: '/modals/directions.html'
                                };
                            } else {
                                return {
                                    template: '/modals/message.html'
                                };
                            }
                        },
                        testID : function () {
                            return 'WHAT DO I RETURN HERE?';
                        }
                    }
                });
            }

呈现 message.html 模态模板:

<div class="admin-directions">
    <div class="directions">
        ARE YOU SURE YOU WANT TO DELETE THIS?
    </div>
    <p class="dismiss-admin-help" ng-click="okay()">Okay</p>
    <p class="dismiss-admin-help" ng-click="cancel()">Cancel</p>
</div>

它使用 directionsCtrl 作为 Modal:

angular
    .module('DDE')
    .controller('directionsCtrl', ['$rootScope', '$scope', '$modalInstance', 'Modal', 'obj', 'Auth', 'VARS', '$route', '$location', 'testID',
        function ($rootScope, $scope, $modalInstance, Modal, obj, Auth, VARS, $route, $location, testID) {

            $scope.template = obj.template;

            $scope.testID = '';

            /**
             * Dismiss modal
             */
            $scope.ok = function() {
                $scope.testID = 'okay';
                return $modalInstance.result($scope.testID);
            };

            $scope.cancel = function() {
                $scope.testID = 'cancel';
                return $modalInstance.result($scope.testID);
            };

    }]);

Answer 1

$modal.open 返回一个 $modalInstance，它有一个名为 result 的属性，它是 promise。你必须调用 .then() 。所以在你的情况下，你想要这个:

    $rootScope.openDirections('warning').result.then(function (res) {
        // Do Stuff
    }, function (err) {
        console.log('ERROR', err);
    });

或者，在您的 openDirections 方法中，您可以只返回 promise :

      showDirections: function(type) {   
            return $modal.open({
               //all your current stuff stays the same here
             }).result; //<-- notice that you are now returning the promise
        }