Angularjs 和 BootstrapUI - 如何根据另一个模态中的变化更新一个模态中的变量

Question

有一个应用使用 Bootstrap Angular UI 和变量 $scope.companies。单击按钮时，第一个模式打开，其中来自该变量的公司显示在 select 元素中。

用户可以单击 添加新公司 按钮以打开新的第二个模式（在现有模式之上），他可以在其中创建新公司。

关闭第二个模式时，用户 returns 转到第一个模式，但是 select 元素中的公司不会更新为刚刚创建的新公司。

我的问题是 - 如何更新第一个模态以使其反映对 $scope.companies 的更改并且新公司在 select 元素中可用？

在主控制器中，我使用工厂（'sharedCompanies）来检索公司：

sharedCompanies.getCompanies().then(function(data){
     $scope.companies = data;
}

然后，每次我打开一个新模式时，我都会像这样将范围传递给它：

$scope.newCompany = function () {
    var newCompanyModalInstance = $uibModal.open({
        templateUrl: '/static/partials/newCompanyModal.html',
        controller: 'NewCompanyCtrl',
        size: 'lg',

        resolve: {
            events: function () {
                return $scope.events;
            },
        },
        scope: $scope
    });

在每个模式中我都可以访问 $scope.companies 并且它们显示正确。新公司已成功创建，但是要使其在 select 元素中可见，我需要关闭模式并再次打开它们...

如何在添加新元素后更新那些模式中的 $scope.companies 变量？

Answer 1

在关闭第二个模式之前创建新公司之后的第二个模式中，使用 $scope.companies.push(newlyCreatedCompany)

将新添加的公司的数据推送到 $scope.companies

Answer 2

感谢评论！在您的帮助下，我诊断出了问题：我没有从模态返回正确的数据！必须添加的是第二个模态中的一行：

$http.post(addNewCompanyAndServicesApiURL, data)
        .then(function successCallback(response) {
            $scope.companies.push(response.data);
            $uibModalInstance.close({
                companies:$scope.companies,
            });
        }, function errorCallback(response){
            //...
        });

这部分在第一个模态中捕捉第二个模态的响应：

newCompanyModalInstance.result.then(function (data) {
        $scope.companies = data.companies;
    });

这解决了我的问题！ :)

Angularjs 和 BootstrapUI - 如何根据另一个模态中的变化更新一个模态中的变量

Angularjs and BootstrapUI - How to update variable in one modal based on changes in another

javascript

angularjs

angular-ui