如何使用 ASP.Net MVC View .csthml 作为 Angular View 而不是 .html

Question

我正在尝试使用 Angulars $routeProvider 将模板加载到我的 Views 文件夹中 .cshtml 文件中的容器中。

我使用此代码收到 404 Angular:

.when('#/second',{ urlTemplate:"Views/second.cshtml",controller:"MainController"})

Angular 找不到 second.cshtml 文件。为什么？不能使用 .cshtml 文件吗？

Answer 1

您不能直接提供 .cshtml 文件。

如果没有服务器端逻辑，则需要将文件转换为 .html 文件，或者如果有逻辑，则需要使用标准 MVC 路由方式请求它：/MyController/MyAction.

Answer 2

您需要配置几个步骤才能向客户端提供 .cshtml。

我创建了一个名为 AngularAspNet at GitHub 的示例项目。

1) 创建 App 文件夹以托管 Angular 脚本。 你可以随便命名。

2) 将 .cshtml 文件放入 App/xxx/Components/ 文件夹。确保属性设置为内容。

我想将 Angular 视图和组件（JavaScript 文件）放在一起。原因是当项目变得更复杂时，它可以帮助我轻松找到 View 和相应的 Component。因此，我没有将 .js 放在 Views 文件夹中，而是将 .chtml 文件放在 App (Angular Script) 文件夹中。

1) 创建一个 web.config 和 BlockViewHandler inside .

<?xml version="1.0"?>

<configuration>
  <configSections>
  ...        
  <system.webServer>
    <handlers>
      <remove name="BlockViewHandler"/>
      <add name="BlockViewHandler" path="*.cshtml" verb="*" 
          preCondition="integratedMode" 
          type="System.Web.HttpNotFoundHandler" />
    </handlers>
  </system.webServer>
   ...
</configuration>

4) 创建控制器和操作方法。

public class NgController : Controller
{
    public PartialViewResult RenderComponents(string feature, string name)
    {
        return PartialView($"~/App/{feature}/Components/{name}");
    }
}

5) 配置路由。

routes.MapRoute(
    name: "Components",
    url: "{feature}/components/{name}",
    defaults: new { controller = "Ng", action = "RenderComponents" });

信用

使用 ASP.NET MVC 5 构建强类型 AngularJS 应用程序通过马特霍尼卡特

AngularJS & ASP.NET MVC Playing nice Tutorial by Miguel Castro

如何使用 ASP.Net MVC View .csthml 作为 Angular View 而不是 .html

How to use ASP.Net MVC View .csthml as Angular View instead of .html

asp.net-mvc

asp.net-web-api

angularjs

ng-view

信用