如何让AngularJS使用$ resource返回mult

时间:2015-07-29 06:01:45

标签: javascript angularjs

我有一个Angular前端的骨架,从后端ruby API读取(用padrino编写)。

'use strict';

(function(angular) {
  function ApiAction($resource) {
    return $resource('/api/',
      { },
      { api_index: {
        method: "GET",
        isArray: true 
        }
      }
                    );
  }

  function whaleCtr($scope, ApiAction) {
    $scope.whaleSubmit = function() {
     // ApiAction.create({}, { whale_name: $scope.whaleName, age: $scope.whaleAge });
      angular.forEach($scope.whales, function(d) {
        ApiAction.create({}, { whale_name: d.whale_name, age: d.age }); 
      });
    };
    var dolphins = ApiAction.api_index({}, {});
    $scope.whales = [];
    dolphins.$promise.then(function(data) {
      angular.forEach(data, function(item) {
        $scope.whales.push(item);
      });
    }, function(data) {
      //if error then...
    });

    $scope.appendwhaleFields = function() {
      var i = $scope.whales.length + 1;
      $scope.whales.push({"id": i, age: "", whale_name: "" })
    }

  }

  var whaleApp = angular.module('whaleApp', ['ngResource']);
  whaleApp.controller('whaleCtr', ['$scope', 'ApiAction', whaleCtr]);
  whaleApp.factory('ApiAction', ['$resource', ApiAction]);
})(angular);

我希望能够让ApiAction工厂做一个基本的创建一个对象/更新一个对象/销毁一个对象,除了能够通过' / api /&#读取api中的所有对象39;路线。是否可以使用以下结构创建解决方案? (显然,据我所知,你可以有多次回复,但我想将所有CRUD动作放在ApiAction函数中。)

建议解决方案的虚拟代码(显然您可以有多次退货)

function ApiAction($resource) {
        return $resource('/api/',
          { },
          { api_index: {
            method: "GET",
            isArray: true 
            }
          }

          return $resource('/api/create',
          { },
          { create: {
            method: "POST",
            isArray: true 
            }
          }

                        );
      }

1 个答案:

答案 0 :(得分:1)

您可能只想向工厂添加处理不同路径/请求方法的函数。 但简单地说,为了保持与您提供的示例类似的结构,只需创建另一个工厂来存储资源请求的详细信息。尝试

whaleApp.factory('ResourceParams', function(){ // We make a new factory call ResourceParams
  var factory= {};
  factory.method ='';
  factory.route = '';
//Add some methods to set it properties
  factory.SetMethod = function(method){
   factory.method = method;
  }
  factory.SetRoute = function(route){
    factory.method = route;
  }
});

接下来将ResourceParams工厂注入您的ApiAction Factory

 whaleApp.factory('ApiAction', ['$resource',ResourceParams, ApiAction]);

最后我们使用ResourceParams工厂来配置我们想要与服务进行交互的方式

function ApiAction($resource,ResourceParams) {
        return $resource(ResourceParams.route,
          { },
          { api_index: {
            method: ResourceParams.method,
            isArray: true 
            }
          }

          return $resource(ResourceParams.route,
          { },
          { create: {
            method: ResourceParams.method,
            isArray: true 
            }
          }
      }

                        );
      }

我希望有所帮助。