0

アンギュラ コードは、html と共に以下に示します。問題は、エンドポイント「/contacts/:id」が Postman と Chrome で json を返すことです。明らかに、これらのテストでは :id を 0037000001pIldUAAS に置き換えましたが、エンドポイントは良好なようです。ページが読み込まれると、'{}' だけが $scope.data に表示されます。ここで一体何が間違っているのですか？私が提供した例は、get() の angular ドキュメントにあるものとほとんど同じです。バックエンドから取得している json が有効であることを確認しました。

異常に見えるものを見た人はいますか?

var app = angular.module('app', ['ngResource']);

app.factory('Contact', ['$resource', function($resource) {
    return $resource('http://localhost:3000/contacts/:id');
}]);

app.controller('ContactCtrl', ['$scope', 'Contact',
    function($scope, Contact) {

        $scope.data = Contact.get({id:'0037000001pIldUAAS'});

    }]);
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>

    <script src="angular.min.js"></script>
    <script src="angular-resource.js"></script>
    <script src="test.js"></script>

</head>

<div ng-app="app">
    <div ng-controller="ContactCtrl">

        {{data}}

        <h5>Is angular working: {{working}}</h5>

        <input ng-model="working"/>

    </div>
</div>

</body>
</html>

API によって返される json の一部を次に示します。

{
  "Id": "0037000001elHP3AAM",
  "LastName": "first",
  "FirstName": "last"
...
}

**編集: Chrome 開発ツールのスクリーンショットを追加:

ここに画像の説明を入力 ここに画像の説明を入力

4

1 に答える 1

0

$resource 構造の重要な部分が欠けています。2 番目のパラメーターは、ルート パラメーターのバインディングを指定するオブジェクトです。

app.factory('Contact', ['$resource', function($resource) {
    return $resource('http://localhost:3000/contacts/:id', {
        id: '@id'
    });
}]);

これが意味することは、get リクエストにオブジェクトを提供すると、angular はそのオブジェクトの id というプロパティを探し、それを :id があるルートにサブスクライブするということです。これを行わないと、代わりにオブジェクト内のすべてのプロパティがクエリ パラメータとして送信されます。これを確認するには、ブラウザで開発ツールを開き、ネットワーク リクエスト セクションに移動します。次のようなネットワーク リクエストが見つかることは間違いありません。

http://localhost:3000/contacts?id=0037000001pIldUAAS
于 2015-07-17T21:51:08.223 に答える