0

angularjs を使用してサービスから json 情報を取得する際に問題があります。

Google から例をダウンロードし、データベースから必要な情報を取得するように変更しました。しかし、機能していないようで、どこが壊れているのかわかりません。ここに私のservice.jsコードがあります:

angular.module('productServices', ['ngResource']).
    factory('Product', function ($resource) {
        return $resource('http://dev.integrator.blondgorilla.com/integratorservice/getproducts?min=0&max=15', {}, {
            query: { method: 'GET', params: { ProductID: 'products' }, isArray: true }
        });
    });

コントローラーは次のようになります

function ProductListCtrl($scope, Product) {
    $scope.products = Product;
}

product-list.html ページは次のようになります。

<div class="span10">
    <!--Body content-->

    <ul class="products">
        <li ng-repeat="product in products" class="thumbnail">
            <p>{{product.ProductID}}</p>
        </li>
    </ul>
</div>

メインの js ファイルは AngularSpike.js です

'use strict';
angular.module('ProsPhere', ['productFilters', 'productServices']).
  config(['$routeProvider', function ($routeProvider) {
      $routeProvider.
          when('/products', { templateUrl: 'partials/product-list.html', controller: ProductListCtrl }).
          when('/products/:productId', { templateUrl: 'partials/product-details.html', controller: ProductDetailCtrl }).
          otherwise({ redirectTo: '/products' });
  }]);

私が使用および変更したコードは、次の場所にあります。

https://github.com/angular/angular-phonecat.git

ありがとうございました、

キアヌーシュ

これまでに見つけた2つの問題：

1-マレクが言った.query() 2-私は別のドメインを呼び出していたので、JSONPを使用する必要がありました

angular.module('productServices', ['ngResource']).
    factory('Product', function ($resource) {
        var test = $resource('http://dev.integrator.blondgorilla.com/integratorservice/getproducts', {}, {
            query: { method: 'JSONP', params: { minid: '0', maxid: '70' }, isArray: true }
        });

        return test;
    });

でもまだ商品が見えない

4

2 に答える 2

0

$resource オブジェクト メソッドは、すぐに空の参照 (isArray に応じてオブジェクトまたは配列) を返します。サーバーからデータが返されると、既存の参照に実際のデータが取り込まれます。したがって、ここでは、ProductListCtrlこの問題を処理するためのコールバック関数が必要です。次のコードを使用してコントローラーを交換できます。

function ProductListCtrl($scope,Product){
    Product.query(function(data) {
        $scope.products=data;
    });
}

またはこれを使用できます：

 function ProductListCtrl($scope, Product) {
       Product.query()
         .$promise.then(function(data) {
           $scope.products=data;
         });
    }
于 2014-08-25T14:00:42.220 に答える
0

最初の問題は次のとおりです。

function ProductListCtrl($scope, Product) {
   $scope.products = Product;
}

つまり、その $resource クラスで取得できる一部の結果ではなく、スコープに $resource を割り当てているということです。

これを試して：

function ProductListCtrl($scope, Product) {
   $scope.products = Product.query();
}

それでも問題が解決しない場合は、実行中の plnkr などを作成していただけると助かります。

于 2013-04-08T09:46:00.123 に答える