如何在同一页面上的同一控制器上拥有两种不同的模态

我的页面上需要有两个模态窗口，每个窗口的内部都是一个带有一些字段的表单，但我不知道如何将所有这些放在同一个控制器中。这是我的代码的 plunker 链接

<html>http://plnkr.co/edit/pudTGMcTAiNNJxHjYNut?p=preview</html>

它工作正常，但我不知道如何将两个控制器合并为一个

我看了一下你的 plunker 代码，很容易将AddControllerGroup组合成 AddController .唯一阻止它的是您open在两个控制器中调用了您的方法。

更新后的AddController如下所示：

sitesApp.controller('AddController', function ($scope, $modal) {
    $scope.openAddSite = function () {
        var modalInstance = $modal.open({
            templateUrl: 'addSites.html',
            controller: 'ModalInstanceCtrl'
        });
    };
    $scope.sites = [
        {
            url:'',
            color:'',
            groups: []
        },
        {
            url:'',
            color:'',
            groups: []
        },
        {
            url:'',
            color:'',
            groups: []
        }
    ];
    $scope.openAddGroup = function () {
        var modalInstance = $modal.open({
            templateUrl: 'addGroups.html',
            controller: 'ModalInstanceCtrl'
        });
    };
    $scope.groups = [
        {
            name:'',
            color:'',
            sites: []
        },
        {
            name:'',
            color:'',
            sites: []
        },
        {
            name:'',
            color:'',
            sites: []
        }
    ];
});

然后我只是更改了您的两个按钮以呼叫openAddSite()和openAddGroup()，这一切都起作用了。

您仍然需要连接一些代码来处理来自模态的结果，但这应该可以让您入门。

相关内容

最新更新

热门标签：