Question

我正在使用Angular UI模式（http://angular-ui.github.io/bootstrap/#modal）

我必须在循环中多次显示相同的模态。

例如，我有一个团队，我需要连续显示每个人的编辑团队成员模式（基本上它是一个向导）

我遇到的问题是它会打开所有模态，堆叠在彼此之上，我想让它们一次打开一个。

for (var i = 0; i < team.SizeLimit; i++) {
    var participant = { }; // assume this hold the correct participant

    var openModal = $modal.open({
        templateUrl: '/Modals/Participant/Edit.html',
        backdrop: true,
        windowClass: 'modal',
        controller: 'ModalParticipantController',
        resolve: {
            title: function () { return 'Edit Participant'; },
            participant: function () { return participant; }
        }
    });

    openModal.result.then(function (data) {
        alert('success!');
    }); 
}

我怎样才能连续打开它们，因为模态是关闭的，一次一个？

Answer 1

我不是一个angularJs用户，但我有一段时间也有同样的问题。

而不是在循环中创建模态，您创建一个带有模态本身的循环，您在关闭当前模态时检查下一个参与者。（我猜测openModal.result.then（）是对它的回调）

var fnOpenModal = function(i) {
        if (i >= team.sizeLimit)
            return;

        var participant = team[i],
            openModal = $modal.open({
                ....
            });

        openModal.result.then(function (data) {
            alert('success!');
            fnOpenModal(i + 1);
        });
    }
fnOpenModal(0);

它绝对不是最好的解决方案，但它是一个有效的快速解决方案： - ）

在循环中显示多个模态

1 个答案: