通过工厂函数

返回解决AngularJS承诺我有，有一个getProduct(id)功能如下图所示通过工厂函数

angular.module('app') 
    .factory('productFactory', ['$http', 'URL', function($http, URL){ 

     var urlBase = URL.APISERVER; 

     //productFactory return object 
     var productFactory = {}; 

     productFactory.getProducts = function(){ 
      return $http.get(urlBase + '/products/'); 
     } 

     productFactory.getProduct = function(id){ 
      return $http.get(urlBase + '/products/' + id); 
     } 
     //return factory object 
     return productFactory; 
    }]);

在我的控制器我想解决getProduct(id)承诺工厂对象。我在另一个功能getProduct(id)中解决了这个承诺，在那里我传递了产品ID。

angular.module('portal') 
    .controller('ProductCtrl', ['$stateParams','productFactory', 
     function($stateParams, productFactory){ 
     //Using 'controller as syntax' in view 
     var prod = this; 

     //Saves status of promise 
     prod.status; 

     //Get a single product 
     prod.product; 

     //Get the product id from stateParams and pass that to 
     //productFactory's getProduct(id) function 
     var id = $stateParams.id; 
     getProduct(id);//THIS IS WHAT CAUSES THE 500 ERROR 

     //Resolves promise 
     function getProduct(id){ 
      productFactory.getProduct(id) 
      .success(function(product){ 
       prod.product = product; 
      }) 
      .error(function(error){ 
       prod.status = 'Unable to load product data' + error.message; 
      }); 
     } 


    }]);

然而，当我在我的控制器调用getProduct(id);我得到500 error那是因为我还没有进入$stateParams.id当控制器编译。

我有一个产品清单。当点击某个产品时，我将重定向到该单一产品的视图。到目前为止它与500 error一起工作。任何想法如何解决这个问题。我最初的想法是在我的控制器中有条件地调用getProduct(id);。我相信有更好的方法来做到这一点。

UPDATE

下面是这种状态下，相应的路由配置。

.state('products-view', { 
    url: '/products/:id', 
    templateUrl: '/core/products/view.html' 
})

来源

2016-02-09 Elvyn Mejia

显示该状态的路由配置。没有理由'$ stateParams'应该不可用假设'id'在url中 – charlietfl

@charlietfl我已经更新了我的问题。 –

如果在URL中有一个有效的ID应该都工作正常。什么是在开发工具网络中用于请求本身的url？它是显示正确的ID还是像'undefined'？如果在浏览器窗口中单独使用URL中的有效标识打开API，API是否工作？ – charlietfl

我使用类似下面的内容来使用ui-router解析http请求。

$stateProvider 
    // nested list with custom controller 
    .state('home.list', { 
     url: '/list/:id', 
     templateUrl: 'partial-home-list.html', 
     resolve:{ 
      // Inject services or factories here to fetch 'posts' 
      posts:function($http, $stateParams){ 
      return $http.get('//jsonplaceholder.typicode.com/posts/' + ($stateParams.id || 1)); 
      } 
     }, 
     // resolved 'posts' get injected into controller 
     controller: function(posts, $scope){ 
      $scope.posts = posts.data; 
     } 
    })

可以依赖注入productFactory而不是$http像我一样。 resolve中指定的密钥posts可以依赖注入到作为函数或字符串指定的控制器中。

来源

2016-02-09 00:51:32

我最初想尝试这个实现，但我认为要解决控制器中的承诺要清晰得多。到目前为止，我通过调用'getProduct（id）'来解决这个问题，当id不是'undefined'时 –

通过工厂函数

回答

相关问题