带有Angularjs的ASP.NET SPA - 组件templateUrl

Question

您好我有使用angularjs的SPA应用程序，我不知道如何使用模板URL创建组件。

我的目录结构是：

SpaApp
 - Scripts
  - App
   - test.component.js
 - Controllers
 - Views
  - Home
   - test.component.cshtml

test.component.js

app.component("appTest", {
    templateUrl: 'test.component.cshtml', //what is the address here?
    transclude: true,
    controller: function AppTest() {}
})

我尝试将url添加到Views / Home / test.component.cshtml，但它无法正常工作。 然后我尝试将html模板添加到与组件javascript相同的文件夹中，它也不起作用。 我的问题在哪里？组件的html模板的地址是什么？谢谢你

Answer 1

您不能将剃刀视图直接用作角度模板。 Razor视图由ASP.NET编译，不由Web服务器直接作为静态文件提供，而Angular模板可以通过http异步加载或通过angulars templatecache检索。

您有两种选择。

1. 不要将剃刀视图（即.cshtml - 文件）用作角度模板。请使用常规.html - 文件。
2. 引用ASP.NET MVC操作，而不是静态文件。在您的情况下（假设默认路由配置），您的templateUrl应该是/Home/Test。

我建议使用第一个选项，并使ASP.NET MVC剃刀视图与angular完全分开。