2013-04-08 61 views
0

我有一个问题,从我的服务使用angularjs获取一些json信息。Angurlarjs获取外部服务

我已经从谷歌下载了这个例子,并修改了这个从数据库中获取我想要的信息。但它似乎并没有工作,我不知道它在哪里破碎。这里是我的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; 
} 

和产品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' }); 
    }]); 

th我使用和修饰的E码可以从

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

发现谢谢,

Kianoush


两个问题,到目前为止,我发现:

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; 
    }); 

但我仍然无法看到产品

回答

0

这是第一个问题:

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

,那就是你要分配$资源范围,而不是可检索的某些结果由那个$资源类。

试试这个:

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

如果还是有什么不对,然后我可以帮你,如果你创建运行plnkr或类似的东西。

+0

谢谢马立克,我已经改变了一个查询,但仍然不告诉我任何错误,它不显示任何产品。 :( – user2256922 2013-04-09 00:45:10

+0

我认为$资源由于某种原因返回空列表。 – user2256922 2013-04-09 01:36:31

+0

欢迎您使用http://plnkr.co/创建运行示例,我将着眼于此。 – Marek 2013-04-09 21:36:25

0

$ resource object method立即返回一个空引用(对象或数组,取决于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; 
     }); 
    }