如何在多个控制器之间共享 $scope 对象答案

【问题标题】：How to share a $scope object between multiple controllers如何在多个控制器之间共享 $scope 对象
【发布时间】：2016-06-27 12:29:43
【问题描述】：

我在 2 个控制器之间共享 $scope 对象时遇到问题。

在控制器“IssueBookCtrl”中，我正在像这样更新书籍对象元素值。

$scope.books[i].issued = true;

然后我使用 $emit 服务与控制器“BookListCtrl_Librarian”共享 $scope 对象。

$scope.$emit('update_parent_controller', $scope.books);

但是当我运行使用控制器“BookListCtrl_Librarian”的视图时，我看不到更新的对象。

controller.js

Controllers.controller('BookListCtrl_Librarian', ['$scope','$http','$location','$rootScope','BookData',
function ($scope, $http ,$location, $rootScope , BookData) {
    $http.get('data/books.json').success(function(data) {
    if($rootScope.books==='undefined'){
        $rootScope.books = BookData.getData();
    }
        $scope.books = data;
    });
    $scope.options = ['bookId', 'cost'];

    $scope.$on("update_parent_controller", function(event, books){
        $scope.books = books;
    });
    $scope.issue = function(bookId) {
        for (var i = 0, len = $scope.books.length; i < len; i++) {
            if ($scope.books[i].bookId == bookId) {
                $rootScope.book = $scope.books[i];
                break;
            }
        }
        $location.path('/issue/'+bookId);
    }
        $scope.return = function (bookId) {
            for (var i = 0, len = $scope.books.length; i < len; i++) {
                if ($scope.books[i].bookId == bookId) {
                    $rootScope.book = $scope.books[i];
                    break;
                }
            }
            $location.path('/return/'+bookId);
        }
    $scope.backToLogin = function() {
        $location.path("/main");
    }
    }]);
Controllers.controller('IssueBookCtrl', ['$scope','$rootScope','$http','$routeParams','$location',
function ($scope,$rootScope, $http, $routeParams, $location) {
    var Id=$routeParams.bookId;
    $http.get('data/books.json').success(function(data) {
        $scope.books = data;
    });
    $scope.issue = function(Id) {
        alert("issued");
       for (var i = 0, len = $scope.books.length; i < len; i++) {             
            if ($scope.books[i].bookId === Id) {
                $scope.books[i].issued = true;              
                $scope.$emit('update_parent_controller', $scope.books);
                $location.path('/home/librarian');
                break;
            }
        }
    }
}]);

请指导我，非常感谢任何帮助。

谢谢

【问题讨论】：

标签： javascript angularjs

【解决方案1】：

你好，你必须使用 rootscope 而不是 scope emit

$rootScope.$emit('update_parent_controller', $scope.books);

在其他控制器中

 $rootScope.$on('update_parent_controller', function(event, books){
    $scope.books = books;
});

【讨论】：

【解决方案2】：

您可以尝试在更改模型后强制执行摘要：

$scope.$apply();

但我建议您构建一个图书服务来保存这些共享模型和逻辑。您可以了解如何创建自己的自定义服务here。

或者你可以嵌套你的控制器（把一个放在另一个里面），这样内部控制器就可以通过使用$parent变量来引用外部控制器的模型。

通过使用其中任何一个，您应该不会在对象更新方面遇到任何问题，因为 AngularJs 在范围变量更改时会运行脏检查。

【讨论】：