angularjs中的$ resource无法正常工作

时间:2012-10-24 08:50:32

标签: javascript rest angularjs

我正在尝试使用带有django的角度我已经使用django tastypie实现了一个REST api, 这是角度资源的代码:

angular.module('CourseServices', ['ngResource']).
    factory('Course', function($resource){
  return $resource('api/v1/course/:courseId/?format=json', {}, {
    query: {method:'GET', params:{courseId:'1'}, isArray:true}
  });
});

这里是我想要的地方:

var course = Course.get({courseId:$routeParams.courseId});
console.log(course);

此代码在浏览器中记录:

Resource
course_pic: "http://localhost:8000/media/course_pics/2012/10/24/Apple-Launches-Genius-Recommendations-for-Apple-TV-2.png"
creation_time: "2012-10-24T06:28:11+00:00"
description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed faucibus cursus mi, in laoreet dolor placerat vitae. ."
id: "1"
instructor: "/api/v1/user/1/"
name: "Computation Theory"
resource_uri: "/api/v1/course/1/"
subscribers: 0
update_time: "2012-10-24T06:28:11+00:00"
__proto__: Resource

所以我有我想要的数据,但当我尝试访问我的控制器中的“course.id”时,我得到了未定义!我不知道为什么! REST服务器响应是json。

2 个答案:

答案 0 :(得分:10)

要解决您遇到的问题,我们首先需要了解$resource的内部工作原理。有一个问题和更长的答案here,但简而言之,我们需要意识到$resource执行异步调用,即使它的语法表明我们正在处理同步调用。

在您的情况下发生的是当您尝试访问控制器中的查询数据时,这些数据还没有准备好。在调用$ resource时,AngularJS将返回一个空对象(占位符类型),并且只有在从服务器返回响应时才会填充数据(属性)。

基本上你在这里遇到的是时间问题。要解决此问题,您可以在调用query方法时使用回调,其中包含以下内容:

var course; Course.get({courseId:$routeParams.courseId}, function(data){
    console.log(data);
    course = data;
    //course.id should be defined here 
});

因此,再次:$resource方法仍然是异步的,即使语法可能另有建议。如果要确保数据准备就绪,则需要处理成功回调中的数据。

答案 1 :(得分:0)

确实$ resource是异步的,但你可以绕过它变成一个延迟值对象,看看here,它可能对你有帮助。