javascript - AngularJS、AngularConfirm - 功能完成后更新确认对话框

Question

我想弄清楚如何在函数完成后更新以下 $ngConfirm 框。

点击提交后，出现如下(齿轮在旋转):

$scope.inProgress = function(){
    $ngConfirm({
        theme: 'modern',
        icon: "fa fa-cog fa-spin fa-.5x fa-fw",
        title: 'File is downloading  Please wait.',
        content: "",
        buttons: {
        }
    });
};

显示此框后，将调用函数 doSomething()。一旦该函数返回，我想将显示更新为以下内容(齿轮停止):

$scope.Complete = function(){
    $ngConfirm({
        theme: 'modern',
        icon: "fa fa-cog fa-.5x fa-fw",
        title: 'Spreadsheet Generated!',
        content: "File size is {$scope.fileSize}, Do you want to save it?",
        buttons: {
            'Yes, save my file': {
                downloadStuff();
                $ngConfirm('Spreadsheet saved to "Downloads" folder.');
            },
            'No, take me back': {
                action: function(){
                    $ngConfirm('Download has been cancelled.');
                }
            }
        }
    });
};

这就是我目前在我的 Controller 中的 submit() 函数中设置它的方式:

$scope.submit = function() {

    $scope.inProgress();

    $scope.doSomething();

    $scope.Complete();
};

使用上面的代码，我的应用程序显示了两个相互分层的元素。我一直在试图弄清楚如何在 $scope.doSomething() 返回后使用 $scope.Complete() 中的详细信息使 $scope.inProgress() 更新。

有人可以就我需要做出哪些改变提供一些建议吗？我试图在提交函数的末尾修改 $scope.inProgress，但我总是最终显示一个新的确认框或实际上没有改变某些东西。

我目前的想法是

$scope.ConfirmationControl = function() {
    $scope.inProgress(){
        storageService.doSomethingCool().then(
            $scope.inProgress() = //updated elements
        )
    }
} 

这有意义吗？我是关闭还是考虑这个完全错误？

预先感谢您的帮助! :)

Angular Confirm

Answer 1

有一个如何更改站点内容的示例。 https://craftpip.github.io/angular-confirm/#quickfeatures .在 Features 标题下，您可以单击标有“Dialogs”的按钮查看示例。基本上，您需要将所有内容都放在 content: 选项中，并带有一些范围变量。当 doSomething() 完成后，设置一个 $scope 变量(在本例中为 $scope.somethingWasDone)并且在你的对话框中有 ng-if。下面是一个未经测试的示例。

$scope.inProgress = function(){
    $scope.title = 'File is downloading. Please wait.';
    $ngConfirm({
        scope: $scope,
        icon: "fa fa-cog fa-spin fa-.5x fa-fw",
        content: '<h2>{{title}}</h2>' +
                 '<div ng-if="somethingWasDone">' +
                     '<div>File size is 250kb, do you want to save it?</div>' + 
                     '<button ng-click="downloadStuff()">Yes</button>' +
                     '<button ng-click="cancel()">No</button>' +
                 '</div>'
    });
};

// when your doSomething function is done
$scope.doSomething().then(function(result) {
    $scope.title = 'Spreadsheet Generated!';
    $scope.somethingWasDone = true;
});