【问题标题】:Accessing JSON with restangular or $resource in AngularJS在 AngularJS 中使用 restangular 或 $resource 访问 JSON
【发布时间】:2013-08-16 21:54:41
【问题描述】:

我已经完成了我所能做的所有阅读,但是我缺少将 AngularJS 与 Django Rest 框架一起使用的东西。为了解决“斜线”问题,我使用了restangular。我的模块的相关部分:

var demoApp = angular.module('demoApp', ['ngResource', 'djangoRESTResources', 'restangular']);

demoApp.config(function($httpProvider){
delete $httpProvider.defaults.headers.common['X-Requested-With'];
});

demoApp.factory('CbgenRestangular', function(Restangular) {
return Restangular.withConfig(function(RestangularConfigurer) {
    RestangularConfigurer.setBaseUrl('http://localhost:1234');
});
});

demoApp.controller('SimpleController', function($scope, simpleFactory, CbgenRestangular, $location){

var lCems = CbgenRestangular.all("cemeteries/");

   $scope.cemeteries = lCems.getList().then(function(cemeteries) {
      console.log(cemeteries[0]);
   }, function(response) {
      console.log(response);
   });

TcpMon 似乎显示了正确的响应:

HTTP/1.0 200 OK
Date: Wed, 14 Aug 2013 18:47:04 GMT
Server: WSGIServer/0.1 Python/2.7.5
Vary: Accept, Cookie
Content-Type: application/json; charset=utf-8
Allow: GET, POST, HEAD, OPTIONS

[{"id": 2, "name": "Trinity Anglican New", "latitude": "N 46 14.041", "longitude": "W 060 13.170", "url": "http://127.0.0.1:1234/cemeteries/2/", "api_url": "#/cemeteries/2"}, {"id": 3, "name": "St. John's Anglican New", "latitude": "N 45 30.697", "longitude": "W 061 01.125", "url": "http://127.0.0.1:1234/cemeteries/3/", "api_url": "#/cemeteries/3"}, {"id": 4, "name": "Holy Rosary", "latitude": "N 46 03.139", "longitude": "W 060 48.479", "url": "http://127.0.0.1:1234/cemeteries/4/", "api_url": "#/cemeteries/4"}]

但是我如何访问它?在我看来,这段代码不起作用:

<ul>
    <li data-ng-repeat="cem in cemeteries | filter:filter.name">{{ cem.name }}</li>
</ul>

我需要手动解析 json 吗?如果是,如何?提前感谢您的帮助。

问候, 菲尔

【问题讨论】:

  • 查看我的种子Angularjs/Django-Rest-Framework。它已经为与 django rest 一起工作做好了一切准备。我相信它会有所帮助。
  • 您好,我尝试使用它,但使用 DatabaseError: no such table: authtoken_token 失败。我不知道 Fabric,所以我不确定下一步要采取什么步骤。
  • 嘿菲利普,它在什么时候给你这个错误?看起来您可能需要运行“python manage.py migrate”。让我知道这是否适合您。
  • 谢谢扎克,做到了。但是,我太初学者了,无法真正理解 services.js 文件中发生的事情。它现在显然可以工作,但我不确定如何将它应用到我的应用程序中。
  • 哦,我明白了,那部分看起来有点紧张。它所做的只是从常量.js 中的“端点”创建资源对象,这样你就可以说 User.query() 并从数据库中获取所有用户。

标签: angularjs django-rest-framework restangular


【解决方案1】:

在回调函数中赋值。

   lCems.getList().then(function(cemeteries) {
      //when successful
      $scope.cemeteries = cemeteries;
   }, function(response) {
      //when failed
      console.log(response);
   });

【讨论】:

  • 是的,但问题似乎是承诺失败了。 IE。我可以在控制台中看到响应对象,但分配永远不会发生。
  • @Philippe 看起来 CbgenRestangular 没有正确注入。
  • 您能否提出解决此问题的策略?我在上面的代码中看不到任何明显的东西来解释为什么它不能正确注入。提前致谢。
  • 这行代码demoApp.controller('SimpleController', function($scope, simpleFactory, CbgenRestangular, $location),我假设你知道如何注入服务。显然他们不匹配。你在哪里定义CbgenRestangular?为什么你认为 Angularjs 知道如何解释CbgenRestangular
  • 这部分不是定义服务吗? demoApp.factory('CbgenRestangular', function(Restangular) { return Restangular.withConfig(function(RestangularConfigurer) { RestangularConfigurer.setBaseUrl('http://localhost:8000'); }); });
【解决方案2】:

这是一个 CORS 问题。将 django-cors-headers 应用程序添加到 Django REST 框架后,它运行良好。

【讨论】:

    猜你喜欢
    • 2016-08-02
    • 2016-06-14
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多