带有 angularJS 的 ASP.NET 无法加载模板

Question

我将 angularJS 应用程序从 xampp 移至 ASP.NET Visual Studio。当我加载我的应用程序时，我收到了找不到模板文件的错误消息。

我尝试了几种方法，但都没有奏效...有人知道问题出在哪里吗？

文件层次结构截图：

这里是包含模板的 JS 代码：

app.config(function ($routeProvider) {
    $routeProvider
        .when('/contacts',
            {
                controller: 'ContactsController',
                templateUrl: '"/home/contacts.html'
            })
        .when('/add-contact',
            {
                controller: 'ContactAddController',
                templateUrl: '/home/addContact.html'
            })
        .when('/edit-contact/:contactId',
            {
                controller: 'ContactEditController',
                templateUrl: '/home/editContact.html'
            })
        .when('/display-contact/:contactId',
            {
                controller: 'ContactDetailsController',
                templateUrl: '/home/displayContact.html'
            })
        .otherwise({ redirectTo: '/contacts' });
});

这里是 RouteConfig.cs（我保留它在我创建新项目时的状态）

 public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
                name: "Default",
                url: "{controller}/{action}/{id}",
                defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
            );
        }
    }

Answer 1

如果您使用的是 ASP.NET (MVCx ?) 的默认路由机制，并要求该应用提供 '/home/contacts.html' 之类的 url，则 ASP.NET 将查找文件调用 HomeController.cs，它将在其中查找名为“contacts.html”的操作。

因为默认模式是 {controller}/{action}/{id}。

向我们展示您的 RouteConfig.cs。您可能需要一个规则来绕过 ASP 的路由并将视图作为静态文件提供，以使其适用于 Angular。

我认为视图文件夹在 MVC 中具有特殊功能，不能用于提供静态文件。 将 .html 文件放在另一种静态目录中，然后从那里尝试。

编辑：

如果您想采用 SPA 方式，只需将您的 html 视图放在 ASP 项目根文件夹中的单独文件夹（例如：angularviews）中，然后像这样调整 RouteConfig.cs：

public class RouteConfig
{
    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

        //exclude template folder from routing
        routes.IgnoreRoute("angularviews/{*pathInfo}");

        //add routes for api calls and stuff you need mapped to an asp controller here
        /*
         ...
        */

        //always deliver the main template for all requests
        routes.MapRoute(
            name: "SPA",
            url: "{*catchall}",
            defaults: new { controller = "Home", action = "Index" }
        );

        /*
        routes.MapRoute(
            name: "Default",
            url: "{controller}/{action}/{id}",
            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
        );
        */
    }
}

然后像 'angularviews/view1.html' 这样加载你的视图