Question

我有一个与Web API后端对话的angularjs前端。我是这个框架的新手，并且不确定如何将复杂的数据从web api中提取到我的应用程序$ scope中。然后，我将使用this front end library在日历小部件中显示数据。

我有一个Session表和一个Session_Instance表，它们以一对多的关系链接在一起。我能够使用$ http来获取数据，$scope.sessions = angular.fromJson(data);将它作为对象存储在$ scope中。麻烦的是我想在这个对象上定义方法并将代码从控制器中拉出来以便我可以利用角度的DI，但我不知道我应该使用什么或如何在Angular中执行它。

是否可以使用角度复杂的数据模型，使用提供程序在应用程序中保持最新？

Answer 1

如果我正确理解您的问题，那么正确的角度方式就是将您的数据包装为服务。

举一个例子，这里有一些代码从this blog复制：

(function () {
    var person = angular.module("person");
    person.factory("PersonService", [
        '$http',
        'httpRestValue',
        function ($http, httpRestValue) {
            var PersonService = {
                data: {
                    currentPerson: {},
                    persons : []
                },
                getPerson: function (id) {
                    return $http.get(httpRestValue + "person/"+id)
                        .success(function success(data) {
                            PersonService.data.currentPerson = data;
                        })
                        .error(function error() {
                        });
                },
                getPersons : function(){
                    return $http.get(httpRestValue + "person/list")
                        .success(function success(data) {
                            PersonService.data.persons = data;
                        })
                        .error(function error() {
                        });
                },
                savePerson : function(person){
                    return $http.post(httpRestValue + "person/",person)
                        .success(function success() {
                            PersonService.getPersons();
                        })
                        .error(function error() {
                        });
                },
                deletePerson : function(id){
                    return $http.delete(httpRestValue + "person/"+id)
                        .success(function success() {
                            PersonService.getPersons();
                        })
                        .error(function error() {
                        });
                }
        };
        return PersonService;
    }
]);
})();

AngularJS提供商和模型

1 个答案: