为什么我得到的var undefined

Question

我试图获取一个Rest数组，然后将其显示在HTML上。 我面临的问题是，在我的工厂中，我能够获取数组并显示其内容，但是在我总是得到Undefined var的控制器中却无法。 这是我的工厂

.factory('coursesService', function($resource) {
                var service = {};
                service.getAllCouses = function (){
                    var Courses = $resource("/myproject/rest/training/trainings");
                    var data = Courses.query().$promise.then(function(data)
                            {
                        service.data= data;
                        console.log("ligne 1: ", service.data[0].name);
                        console.log("ligne 1: ", service.data[0].creator);
                        console.log("ligne 2: ", data[1].name);
                        console.log("ligne 2: ", data[1].creator);
                        return service.data;
                            }); 
                }
                return service;
            })

和我的控制器

.controller("CoursesController",
            function CoursesController($scope, coursesService) {
                var courses = {};
                courses = coursesService.getAllCouses();
                console.log("courses: ", courses);
            })

结果我得到这个：

courses:  undefined
ligne 1:  Angular
ligne 1:  Object {id: "1", username: "User1", email: "user1@gmail.com",    password: "password", userProfile: Object}
ligne 2:  JavaScript
ligne 2:  Object {id: "1", username: "User1", email: "user1@gmail.com", password: "password", userProfile: Object}

为什么我要上课程：未定义？ 并且不应该显示在我在工厂中显示的列表之后？

Answer 1

您的getAllCouses函数从不返回任何内容，因此调用它总是导致undefined 。 查询promise的回调 ， then处理程序返回某些内容，但不返回getAllCouses 。

您需要让getAllCouses返回诺言， then在该诺言的then处理程序中使用结果。 您不能仅直接使用其返回值，如果Courses.query()是异步的，则不能使用它（如果不是，那么为什么它返回一个Courses.query() ？）。

看起来像这样：

.factory('coursesService', function($resource) {
    var service = {};
    service.getAllCouses = function (){
        var Courses = $resource("/myproject/rest/training/trainings");
        var data = Courses.query().$promise.then(function(data) {
            service.data= data;
            console.log("ligne 1: ", service.data[0].name);
            console.log("ligne 1: ", service.data[0].creator);
            console.log("ligne 2: ", data[1].name);
            console.log("ligne 2: ", data[1].creator);
            return service.data;
        }); 
        return data;        // <=== Return the promise (`data` is a bit of a suspect name)
    };
    return service;
})

然后：

.controller("CoursesController", function CoursesController($scope, coursesService) {
    coursesService.getAllCouses().then(function(courses) {   // <=== Use the promise
        console.log("courses: ", courses);                   // <===
    });                                                      // <===
})

...但我不是Angular的人。

Answer 2

getAllCouses（）不返回值，它仅设置两个局部变量，课程和数据。

Courses.query承诺仅在Web请求完成后才能解决，因此这些日志会延迟。

Answer 3

我通过更新服务和控制器来解决此问题，如下所示：

.factory('coursesService', function($resource) {
        return $resource("/myproject/rest/training/trainings", {
            query : {
                method : "GET",
                isArray : true
            }
        });
    });

我刚刚添加了

isArray : true 

我更新了控制器

.controller(
            "CoursesController",
            function UserController($scope, coursesService) {
                coursesService.query(function(data) {
                    console.info("data: ", data)
                    console.log("1st course: ", data[0].name)
                    $scope.Courses = data; 
                });

Answer 4

我以这种方式修复它：

.factory('coursesService', function($resource) {
        return $resource("/myproject/rest/training/trainings")
    })

和控制器：

.controller("coursesController", function($scope, coursesService) {
        coursesService.query(function(data) {
            $scope.Courses = data;
        });
    })