Question

我有一个带有Controller_1的页面
Controller_1在另一个我们称之为Controller_2的文件上打开一个带有不同控制器的模态
然后Controller_2打开另一个模式，在我们称之为Controller_3的不同文件上有不同的控制器

所以我们有：

Controller_1 - 打开模态 - ＆gt; Controller_2 - 打开模态 - ＆gt; Controller_3

当我用Controller_3关闭模态时，我想将值传递给Controller_1。

我的代码：

Controller_1使用Controller_2

打开一个模态

app.controller("Controller_1", ['$scope', '$http', '$modal', 
function ($scope, $http, $modal) {

$scope.openModal_1 = function () {

    var modalInstance = $modal.open({
        templateUrl: '/SomeFolder/FileWithController_2',
        controller: 'Controller_2',
    });
}

}]);

Controller_2使用Controller_3

打开一个模态

app.controller("Controller_2", ['$scope', '$http', '$modalInstance', '$modal',
function ($scope, $http, $modalInstance, $modal) {

$scope.SaveSomething = function () {

            $http.post(url, obj)
                .success(function (data) {
                        var modalInstance = $modal.open({
                        templateUrl: '/SomeFolder/FileWithController_3',
                        controller: 'Controller_3',
                        }
                    });

                }).error(function () {

                });
        };
    }]);

Controller_3保存然后关闭并将一些数据传递给Controller_1

app.controller("Controller_3", ['$scope', '$http', '$modalInstance',
function ($scope, $http, $modalInstance) {        

   $scope.SaveSomething = function () {

                    $http.post(url, obj)
                        .success(function (data) {

                             ... pass some code to Controller_1 and close this modal.

                            });

                        }).error(function () {

                        });
                };
            }]);

假设一切正常，我想要做的就是将一些数据从Controller_3传递给Controller_1。

我的问题是：如何将数据从Controller_3传递到Controller_1？

我在打开模态时已尝试传递$ scope，如下所示：

//from Controller_1 to Controller_2

     var modalInstance = $modal.open({
                templateUrl: '/SomeFolder/FileWithController_2',
                controller: 'Controller_2',
                scope: $scope,
            });

在这种情况下它仅适用于Controller_2，因此对$ scope的任何修改都会影响Controller_1，但如果我对Controller_3执行相同的操作，它的工作方式也不一样

我尝试了$ emit和$ on但它也不起作用，因为它们不是这样的父母和孩子：

<div ng-controller="ParentCtrl">
    <div ng-controller="ChildCtrl"></div>
</div>

他们在不同的文件中完成不同的控制器。

Answer 1

请参阅Angular doc

中的$ parent

声明你的模态实例，

 var modalInstance = $modal.open({
            templateUrl: '/SomeFolder/FileWithController_3',
            controller: 'Controller_3',
            scope: $scope.$parent,
        });

因此，您基本上可以在controller_3中调用方法或编辑controller_1中的属性。

app.controller("Controller_3", ['$scope', '$http', '$modalInstance',
function ($scope, $http, $modalInstance) {        

app.controller("Controller_3", ['$scope', '$http', '$modalInstance',
function ($scope, $http, $modalInstance) {        

   $scope.SaveSomething = function () {    
      $http.post(url, obj)
           .success(function (data) {
                $scope.$parent.modethodToCall(data);
           })
           .error(function () {});
   };
}]);

我认为你必须添加另一个$ parent，因为$ modal创建它自己的子$ scope。如果有人可以确认？

我个人不会建议使用父属性/方法。在我的项目中，我使用params创建模态实例，并在模态闭包上返回一个对象。（参见Angular ui doc中的$ modal）

$modalInstance.close(data);

如何在Angularjs

1 个答案: