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

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

我用这个代码得到了一个404 Angular:

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

Agular找不到second.cshtml文件.
为什么?
是不是可以使用.cshtml文件

为了向客户端提供.cshtml,您需要配置几个步骤.

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

1)创建App文件夹以托管Angular Scripts.你可以说出你想要的任何名字.

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

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

1)在里面创建一个带有BlockViewHandler的web.config.

<?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>@H_301_4@ 
 

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

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

5)配置路由.

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

信用

Building Strongly-typed AngularJS Apps with ASP.NET MVC 5
by Matt Honeycutt

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

相关文章

AngularJS 是一个JavaScript 框架。它可通过 注:建议把脚本放在 元素的底部。这会提高网页加载速度,因...
angluarjs中页面初始化的时候会出现语法{{}}在页面中问题,也即是页面闪烁问题。出现这个的原因是:由于...
AngularJS 通过被称为指令的新属性来扩展 HTML。AngularJS 指令AngularJS 指令是扩展的 HTML 属性,带有...
AngularJS 使用表达式把数据绑定到 HTML。AngularJS 表达式AngularJS 表达式写在双大括号内:{{ expres...
ng-repeat 指令可以完美的显示表格。在表格中显示数据 {{ x.Name }} {{ x.Country }} 使用 CSS 样式为了...
$http是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。读取 JSON 文件下是存储在web服务器上...