0

私は角度のある工場とコントローラーを持っています:

angular.module('myApp', ['ui.router', 'ngResource'])
.factory('Widget', ['$http', function WidgetFactory($http) {
    return {
        all: function() {
            return $http({method: "GET", url: "/widgets"});
        }
    };
}])
.controller('StoreCtrl', ['$scope', 'Widget', function($scope, Widget) {
    $scope.widgets = Widget.all();
}]);

私のフロントエンドでは

<div ng-controller="StoreCtrl">
    <li ng-repeat="widget in widgets">
        {{ widget.price }}
        {{ widget.name }}
    </li>
</div>

しかし、my{{ widget.price }}などには何も取り込まれません。
何が欠けていますか?

4

3 に答える 3

3

フレームワークが期待するように、約束を完全に解決していません。promiseに関する説明については、 $q のドキュメントを参照してください。また、ビュー モデルの値 (スコープ) を、次で構成される応答オブジェクトからの正しい戻り値に設定する必要があります...

  • data – {string|Object} – で変換された応答本文
  • 変換機能。status – {number} – の HTTP ステータス コード
  • 応答。headers – {function([headerName])} – ヘッダー getter 関数。
  • config – {Object} – 生成に使用された構成オブジェクト
  • リクエスト。statusText – {string} – 応答の HTTP ステータス テキスト。

次のことを守ってください...

Widget.all().then(function (response) {
    $scope.widgets = response.data;
});

さらに、いくつかの観察として、 で行ったようにファクトリ関数に名前を付ける必要はありWidgetFactoryません。無名関数で十分です。$http ショートカット メソッド getなどを利用することもできます...

.factory('Widget', ['$http', function($http) {
    return {
        all: function() {
            return $http.get('/widgets');
        }
    };
}]);
于 2016-03-09T05:35:17.650 に答える
2

$http は promise を返します。promise が解決されたら、応答データを $scope.widgets に割り当てる必要があります。コントローラーで、これを試してください:

Widget.all().then(function (data) {
    $scope.widgets = data;
});
于 2016-03-09T04:47:49.960 に答える
0

まず、配列のオブジェクトがあることを確認してください

  $scope.widgets; 

あなたのコントローラーで。 コントローラーでこの行を印刷できます

console.log($scope.widgets);

データが利用可能かどうかを確認します。

于 2016-03-09T05:05:55.403 に答える