如何从控制器之间的休息服务共享数据

时间:2015-03-04 20:41:08

标签: javascript angularjs

我的问题在于我在REST服务中有一些数据,我想得到它们然后发送给其他控制器。但我不知道如何正确执行,因为service $ http.get()是异步执行的。我将向您展示我的代码,以便更好地代表问题。

我创建了一个控制器,负责从REST服务获取数据。

MyApp.controller("AppController", ["$scope", "$http", function($scope,$http) {

    $http.get("http://localhost:8080/library/book").success(function(data) {
        $scope.bookList = data;
    });
    $http.get("http://localhost:8080/library/author").success(function(data) {
        $scope.authorList = data;
    });
    $http.get("http://localhost:8080/library/publisher").success(function(data) {
        $scope.publisherList = data;
   });

}]);

BookList,authorList,publisherList是其余控制器的构建材料。

好的,我展示了其他代码。

MyApp.service("BookListModel", function() {

this.createBookList = function(bookList, authorList, publisherList) {
    var i = 0, j = 0, authorName, publisherName, bookListItems = [];

    for(; i < bookList.length; i++) {

        for(; j < authorList.length; j++) {
            if(bookList[i].authorId == authorList[j].authorId) {
                authorName = authorList[j].name;
            }
        }

        j = 0;

        for(; j < publisherList.length; j++) {
            if(bookList[i].publisherId == publisherList[j].publisherId) {
                publisherName = publisherList[j].name;
            }
        }

        j = 0;

        bookListItems.push({'title' : bookList[i].title, 'author' : authorName, 'publisher' : publisherName});
        authorName = "", publisherName = "";
    }

    return bookListItems;
};
});

例如,这是我的服务之一。它创建了作者和出版商的图书清单,它有三个参数,我不知道如何将数据从AppController传递到createBookList函数。

3 个答案:

答案 0 :(得分:2)

使用工厂/服务进行REST呼叫(不要在控制器中进行)。

如果你同时进行所有这些调用,你可以使用$ q.all()来组合承诺并获得一个承诺。

每当控制器获得该承诺时,他们每次都会获得相同的数据,而您的REST服务只会被调用一次。

您的控制器只需调用LibraryService.getLibraryData()并处理承诺以获取数据本身。

MyApp.factory('LibraryService', function($http, $q){
    var service = {};
    var libraryDataPromise = $q.defer();

    $q.all({
        books: $http.get("http://localhost:8080/library/book"),
        authors: $http.get("http://localhost:8080/library/author"),
        publishers: $http.get("http://localhost:8080/library/publisher"),
    }).then(function(response){
        libraryDataPromise.resolve({
            bookList: response.books,
            authorList: response.authors,
            publisherList: response.publishers
        });
    });

    service.getLibraryData = function() {
      return libraryDataPromise.promise;    
    };

    return service;
});

答案 1 :(得分:1)

您也可以进行角度广播。在你的'AppController'中:

....
http.get("http://localhost:8080/library/book").success(function(data) {
    $scope.$broadcast('bookList-updated', data);
}
....

然后在您想要使用数据的其他控制器中执行以下操作:

....
$scope.$on('booklist-updated', function(event, booklist){
    $scope.booklist = booklist;
});
....

答案 2 :(得分:0)

使用角度服务

app.service('mySharedService', function ($rootScope) {
    this.bookList = [];
    this.authorList = [];
    this.publisherList = [];

    this.setBookList = function (bookList) {
        this.bookList = bookList;
    };
    this.setPublisherList = function (publisherList ) {
        this.publisherList = publisherList ;
    };
    this.setAuthorList = function (authorList ) {
        this.authorList  = authorList ;
    };
    this.getBookList = function () {
        return this.bookList;
    };

    this.getPublisherList  = function () {
        return this.publisherList;
    };
    this.getAuthorList = function () {
        return this.authorList;
    };
});

确保通过\将您的服务注入您的控制器

MyApp.controller("AppController", ["$scope", "$http", "mySharedService", function($scope,$http) {

$http.get("http://localhost:8080/library/book").success(function(data) {
    $scope.bookList = data;
    mySharedService.setBookList(data);
});
$http.get("http://localhost:8080/library/author").success(function(data) {
    $scope.authorList = data;
    mySharedService.setPublisherList(data);
});
$http.get("http://localhost:8080/library/publisher").success(function(data) {
    $scope.publisherList = data;
    mySharedService.setAuthorList(data);
});
}]);

注意:我没有测试代码。