从子模态的控制器返回到父模态的控制器的值

时间:2016-02-10 12:46:07

标签: angularjs angular-ui-router angular-ui

我的申请中有两种状态。在每个状态中,我打开一个模态对话框,它有自己的控制器:parentCtrlchildCtrl。我想在select(config)函数中返回父模态并将config值返回到父状态,只需返回parentCtrl

$stateProvider.state('parent', {
                url: "...",
                onEnter: function ($stateParams, $state, $uibModal) {
                    $uibModal.open({
                        templateUrl:  '...',
                        controller: function ($scope, $uibModalInstance) {
                            ...
                        },
                        controllerAs: 'parentCtrl'
                    });
                }           
        }); 

$stateProvider.state('parent.child', {
                url: "...",
                onEnter: function ($stateParams, $state, $uibModal) {
                    $uibModal.open({
                        templateUrl:  '...',
                        controller: function ($scope, $uibModalInstance) {
                            this.select = function (config) {
                                debugger;
                                alert("Hall:"+ config.hallName+", configuration:"+ config.name+", configId: "+ config.id);
                                $uibModalInstance.close({data: config});
                            };
                        },
                        controllerAs: 'childCtrl'
                    }).result.finally(function () {
                        debugger;
                        $state.go('^');
                    });
                }
            });

2 个答案:

答案 0 :(得分:1)

对于bootstrap模态,模态范围将是控制器范围的子节点,并且在角度范围内是链接的。

因此,如果您使用以下命令初始化父控制器:     $ scope.modal = {};     $ scope.modal.newData = function(data){};

你应该能够在模态控制器中做到:     $ scope.modal.newData(data);

注意:中间对象模态是因为范围继承的限制,你可能没有这个javascript的问题,但你可能有模板,所以我总是在玩范围继承时使用interdiary对象。

编辑:没有看到它是2独立模态。最好的方法是使用我发布的内容并关闭并再次打开来自父作用域数据的父模式,以便刷新它。

否则你可以使用$ scope / $ rootScope发出/侦听angularjs中的事件。$ on / $ emit。

对于这种东西,请使用$ rootScope。$ on来监听,并使用$ rootScope.emit来发送事件。

答案 1 :(得分:1)

您的子模态的结果可以传递参数。

.result.then(function (data) {
     $state.go('^', data);
});

此数据是您在.close()操作中输入的参数。您可以在状态配置中捕获这些参数,方法是在父状态定义中添加以下内容

params: {
        data: {}
    }