angularjs - Angular js工厂消费asp.net webApi

Question

如何在 Angular js 工厂中使用 webApi？

WebAPI

public class WarrantyController: ApiController {
    public WarrantyViewModel Get(string c, string l, string s, string cs, string productcode, string ordercode, string overrides) {
        var response = Query(new WarrantyQuery(UserContext.CreateContext(c, l, s, cs), productcode, ordercode, overrides));
        return response.Data;
    }
}

这将返回 json 结果：

获取 /api/shop/warranty/get/us/en/abc/19/productA/abc-123 HTTP/1.1

Answer 1

Angular Resource 模块是使用 Rest API 的好帮手。

您可以创建一个工厂，如：

angular.module('appService', ['ngResource'])
    .factory('Warranty', function($resource) {
        return $resource('/api/warranty/');
    });

然后，将您的工厂注入到您的 Angular 应用程序中，如下所示：

var app = angular.module('app', ['appService']);

最后，您可以在控制器中访问您的工厂：

app.controller('warrantyController', function($scope, Warranty) {
  $scope.warranties = Warranty.query();
});

所有其他 CRUD 操作将自动添加到您的保修对象中。有关更多信息，您可以访问ngResource 文档

Answer 2

与任何 API 通信的方式相同，使用$http服务。

有了这个，您可以获得 HTTP 动词速记：

// Returns a promise with warranty list as a resolved parameter
function getWarranties() {
  return $get('/api/warranty').then(function(resp) {
    return resp.data;
  });
}

或者你可以使用 raw$http方法：

// Returns a promise with warranty list as a resolved parameter
function getWarranties() {
  return $http({
    url: '/api/warranty',
    method: 'get',
    // other options...
  }).then(function(resp) {
      return resp.data;
  });
}