Angularjs 在 Asp.net MVC 项目中调用 Web api 控制器

Question

我正在开发一个使用 ASP.NET MVC、AngularJs 和 WebApi 2.0 的项目。 我正在从 angularjs 调用网络 api 控制器。我必须创建第一个网络 api 控制器。 所以我更新了global.asax中的start_application，添加了下面的代码：

public static void Register(HttpConfiguration config)
{
    // Web API configuration and services

    // Use camel case for JSON data.
    //config.Formatters.JsonFormatter.SerializerSettings.ContractResolver = new CamelCasePropertyNamesContractResolver();

    // Web API routes
    config.MapHttpAttributeRoutes();

    config.Routes.MapHttpRoute(
        name: "DefaultApi",
        routeTemplate: "api/{controller}/{id}",
        defaults: new { id = RouteParameter.Optional }
    );
}

然后我创建了第一个 web api 控制器（我第一次在文件夹 controller 中创建它但是它没有工作，我认为它会与 mvc 路由冲突，所以我创建了一个文件夹 WebApi\Controllers):

[Route("api/Countries")]
public class CountriesController : ApiController
{
    [HttpGet]
    public IHttpActionResult GetCountries()
    { //<-- Here, I put a breakpoint and never go in
        return Ok();
    }
}

我在 angularjs 中创建了一个工厂：

intranet
    .factory("countriesService", function ($resource, ENDPOINT) {
        return {
            countries: $resource(ENDPOINT + "api/Countries/")
        };
    });

我在 angular 控制器中调用服务：

$scope.getCountries = function () {
    new countriesService
            .countries
            .query({ }, getCountriesSuccess, getCountriesError);
};

我收到以下错误：

angular.js:9818 GET http://localhost:50407/api/Countries 404（未找到）

Answer 1

我配置路由的顺序很重要...我的配置是

AreaRegistration.RegisterAllAreas();
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);
GlobalConfiguration.Configure(WebApiConfig.Register);

必须变成如下

AreaRegistration.RegisterAllAreas();
GlobalConfiguration.Configure(WebApiConfig.Register); 
FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
RouteConfig.RegisterRoutes(RouteTable.Routes);
BundleConfig.RegisterBundles(BundleTable.Bundles);