3

我有一个使用 Angular Material UI 框架的 AngularJS 应用程序。

该应用程序有不同的机制显示对话框（例如错误和加载微调器），最好只关闭在某些情况下特别选择的一个，例如当 AJAX 请求完成获取数据时，我希望我的加载微调器关闭，但不是可能是获取结果的任何错误对话框。

我在文档和代码中可以找到的内容不一致（尽管代码应该赢得争论）：

  • 文档说只有最新的可以关闭，并有一个可选的响应
  • 代码说的是最新的，可以关闭一些最新的或者全部打开的，有可选的原因
  • 文档中的示例说可以关闭特定对话框，并带有表示方式或原因的标志

我已经做了一个我的意图的演示，尽可能MCV - 这些是亮点：

var dialog = {},
    promise = {};

function showDialogs(sourceEvent) {
    showDialog(sourceEvent, "one");
    showDialog(sourceEvent, "two");
}

function showDialog(sourceEvent, id) {
    dialog[id] = $mdDialog.alert({...});

    promise[id] = $mdDialog.show(dialog[id]);
    promise[id].finally(function() {
        dialog[id] = undefined;
    });
}

function closeDialogs() {
    $mdDialog.hide("Closed all for a reason", {closeAll: true});
}

function closeDialogLatest() {
    $mdDialog.hide("Closed from the outside");
}

function closeDialogReason() {
    $mdDialog.hide("Closed with a reason");
}

function closeDialogSpecific(id) {
    $mdDialog.hide(dialog[id], "finished");
}

编辑：
我知道代码总是赢得关于发生了什么的争论，但我不完全确定这是我正在查看的正确代码。
我更新了示例以更好地测试和说明我的观点和问题。这显示了代码所说的事情。

我真正在寻找的是，是否仍有可能以我还没有想到的其他方式实现我的目标。

4

2 回答 2

4

使用$mdPanel代替$mdDialog我能够达到预期的效果；我分叉了我的演示以反映这些变化——这些是亮点：

var dialog = {};

function showDialogs() {
    showDialog("one");
    showDialog("two");
}

function showDialog(id) {
    var config = {...};

    $mdPanel.open(config)
        .then(function(panelRef) {
            dialog[id] = panelRef;
        });
}

function closeDialogs() {
    var id;

    for(id in dialog) {
        closeDialogSpecific(id, "Closed all for a reason");
    }
}

function closeDialogSpecific(id, reason) {
    var message = reason || "finished: " + id;

    if(!dialog.hasOwnProperty(id) || !angular.isObject(dialog[id])) {
        return;
    }

    if(dialog[id] && dialog[id].close) {
        dialog[id].close()
            .then(function() {
                vm.feedback = message;
            });
        dialog[id] = undefined;
    }
}
于 2016-09-30T12:20:11.670 回答
2

我建议同时打开两个或多个对话框并不理想，Google Material design 可能不推荐。

从文档中引用

谨慎使用对话，因为它们具有干扰性。

你说：

当 AJAX 请求完成获取数据时，我希望我的加载微调器关闭，但不是任何可能是获取结果的错误对话框。

我的解决方案是有一个最初显示微调器的对话框。请求完成后，用任何消息替换微调器。

于 2016-09-02T12:29:20.413 回答