2013-06-25 17 views
8

私は作成したDjangoバックエンドからレコードをフェッチするために、AngularJSベースのフロントエンドをrestangularで使用しています。AngularJS/Restangularルーティング "未定義のプロパティ 'route'を設定できません。

私は次のようにクライアントリストのためのコールを作ってるんだ:

var app; 

app = angular.module("myApp", ["restangular"]).config(function(RestangularProvider) { 
    RestangularProvider.setBaseUrl("http://172.16.91.149:8000/client/v1"); 
    RestangularProvider.setResponseExtractor(function(response, operation) { 
    return response.objects; 
    }); 
    return RestangularProvider.setRequestSuffix("/?callback=abc123"); 
}); 

angular.module("myApp").controller("MainCtrl", function($scope, Restangular) { 
    return $scope.client = Restangular.all("client").getList(); 
}); 

ChromeはHTTP 200を使用してデータを返すバックエンドを示している。

abc123({ 
    "meta": { 
     "limit": 20, 
     "next": "/client/v1/client/?callback=abc123&limit=20&offset=20", 
     "offset": 0, 
     "previous": null, 
     "total_count": 2 
    }, 
    "objects": [{ 
     "id": 1, 
     "name": "Test", 
     "resource_uri": "/client/v1/client/1/" 
    }, { 
     "id": 2, 
     "name": "Test 2", 
     "resource_uri": "/client/v1/client/2/" 
    }] 
}) 

しかし、それは私が「起こったらChromeのコンソールに次のスタックトレースが表示されます:

TypeError: Cannot set property 'route' of undefined 
    at restangularizeBase (http://172.16.91.149:9000/components/restangular/src/restangular.js:395:56) 
    at restangularizeCollection (http://172.16.91.149:9000/components/restangular/src/restangular.js:499:35) 
    at http://172.16.91.149:9000/components/restangular/src/restangular.js:556:44 
    at wrappedCallback (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:6846:59) 
    at http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:6883:26 
    at Object.Scope.$eval (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:8057:28) 
    at Object.Scope.$digest (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:7922:25) 
    at Object.Scope.$apply (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:8143:24) 
    at done (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:9170:20) 
    at completeRequest (http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js:9333:7) angular.js:5754 

私はブレークポイントを実行しましたrestangular.js内の行395上:

L394 function restangularizeBase(parent, elem, route) { 
L395  elem[config.restangularFields.route] = route; 

それがブレークポイントelemを打つ最初の時間は単なるオブジェクトであり、routeclientの値を持ちます。

2回目のブレークポイントに達するとelemは未定義で、routeの値はclientです。

elemが2回目の周りに定義されない理由はありますか?

答えて

8

私はRestangularの作成者です。

restangularizeBase関数がコレクションの最初に呼び出され、次に各要素に対して呼び出されます。

StackTraceから、要素はOKですが、コレクションがrestangularizeBaseに送信されると、実際には定義されていません。 console.logのresponse.objectsをお願いしますか?また、最新バージョンに更新してください。

また、デフォルトのリクエストパラメータでは、requestSuffixではなくdefaultRequestParamsを使用する必要があります。 requestSuffixは "/"の末尾にのみ使用する必要があります

もう少しお手伝いできることをお知らせください。

19

リストを要求するとき、Restangularは、サーバーからのデータが単純な配列であると予測します。ただし、結果のデータがページ区切り情報などの結果メタデータでラップされていると、それは分解されます。あなたがDjangoのRESTフレームワークを使用している場合

、それはこのように包まれた結果を返します:

{ 
    "count": 2, 
    "next": null, 
    "previous": null, 
    "results": [ 
     { 
      "id": 1, 
      "name": "Foo" 
     }, 
     { 
      "id": 2, 
      "name": "Bar" 
     } 
    ] 
} 

はこれを翻訳するには、応答抽出関数を作成する必要があります。これは、モジュールの設定で指定するのが最も簡単です:

angular.module('myApp', ['myApp.controllers', 'restangular']). 
config(function(RestangularProvider) { 
    RestangularProvider.setBaseUrl("/api"); 

    // This function is used to map the JSON data to something Restangular 
    // expects 
    RestangularProvider.setResponseExtractor(function(response, operation, what, url) { 
     if (operation === "getList") { 
      // Use results as the return type, and save the result metadata 
      // in _resultmeta 
      var newResponse = response.results; 
      newResponse._resultmeta = { 
       "count": response.count, 
       "next": response.next, 
       "previous": response.previous 
      }; 
      return newResponse; 
     } 

     return response; 
    }); 
}); 

これは、メタデータを含む、_resultmetaの追加のプロパティを使用して、単純な配列であることを結果を並べ替えます。 Restangularは、配列とそのオブジェクトであり、オブジェクトであり、期待通りに配列を処理するときに_resultmetaプロパティにアクセスできます。

+2

@ mark-lこれを答えにすることをお勧めします。ありがとう。 –

関連する問題