如何从同一项目中的angular 4页导航到asp.net web表单_.net_Angular

如何从同一项目中的angular 4页导航到asp.net web表单

.net angular

如何从同一项目中的angular 4页导航到asp.net web表单,.net,angular,.net,Angular,我需要保持两个角度4页和asp。net web表单在一个项目中，因为web需要从asp.net转换到angular，而这不能一次性完成，所以我需要保留这两个页面并使其正常运行如何从同一项目中的angular 4页导航到asp.net web表单任何帮助都将不胜感激我们能够在MVC应用程序中交付angular 2应用程序。我们还希望慢慢地从MVC迁移。因此，我们首先将特性重新写入angular，angular开发完全独立，然后将编译后的angular应用程序复制到我们的mvc应用程序中，实际上

我需要保持两个角度4页和asp。net web表单在一个项目中，因为web需要从asp.net转换到angular，而这不能一次性完成，所以我需要保留这两个页面并使其正常运行

如何从同一项目中的angular 4页导航到asp.net web表单

任何帮助都将不胜感激

我们能够在MVC应用程序中交付angular 2应用程序。我们还希望慢慢地从MVC迁移。因此，我们首先将特性重新写入angular，angular开发完全独立，然后将编译后的angular应用程序复制到我们的mvc应用程序中，实际上我们有脚本来处理angular编译和复制。然后我们通过razor视图交付angular应用程序。由于angular应用程序是在razor视图中交付的，因此我们可以包含链接，并且angular应用程序位于主mvc布局中

包含angular应用程序的razor视图是angular应用程序中的index.html，其中一些razor内容可以从mvc传递到angular应用程序中

<!doctype html>
<html lang="en">
<head>
<title>Page with SPA</title>
<base href="/set/base/ref/">
<link href="styles.bundle.css" rel="stylesheet" />
</head>
<body>
<div>
    <a href="/SomeController/Index/Index">
        <i></i> back to list
    </a>
    <h4>approve</h4>
</div><div>
<angular-comp somePathNeeded="@Model.SomeData" someIdNeededByAngular="@Model.SomeId" taskId="@Model.SomethingElse" someUrlNeededByAngular="/Url/Inside/Mvc" lastTaskId="@Model.MoreData" firstTaskId="@Model.OtherData" nextTaskId="@Model.MoreDataId" previousTaskId="@Model.OtherthingsINeedInAngular"></angular-comp></div>
<script type="text/javascript" src="./assets/js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="./assets/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="./assets/js/jquery-ui-1.8.14.min.js"></script>
 </script>
<script type="text/javascript" src="inline.bundle.js"></script>
<script type="text/javascript" src="polyfills.bundle.js"></script>
<script type="text/javascript" src="vendor.bundle.js">    </script>
<script type="text/javascript" src="main.bundle.js"></script>
</body>
</html>

因此，angular应用程序是单独创建的，然后作为razor视图包含在我们的mvc应用程序中。从那里你可以传递任何你想传递的东西。并包括链接。因为它是一个剃刀视图，所以它位于mvc应用程序的主布局内。因此，整个现有mvc应用程序的链接都可以正常工作。但是，如果您需要由角度组件生成和显示的角度组件内部的链接，则可能需要将这些链接传入

另外，为了让razor能够识别.html文件并像解析cshtml一样解析它们，您可以注册一个视图引擎来处理类似于cshtml的html。有点像

 System.Web.Razor.RazorCodeLanguage.Languages.Add("html", new System.Web.Razor.CSharpRazorCodeLanguage());
 ViewEngines.Engines.Add(new HtmlViewEngine());

当应用程序启动时

 class HtmlViewEngine : RazorViewEngine
{
    public HtmlViewEngine()
    {
        FileExtensions = new[] { "html" };

    }
}

可能还有更多的内容，但基本上您需要使.html文件像.cshtml一样处理，您可以通过将处理.cshtml和.html的razor引擎关联起来来实现。或者，在角度开发中，您可以将index.html index.cshtml命名为index.html。但是，当然这会弄脏你的angular应用程序

我希望这对你有帮助

 class HtmlViewEngine : RazorViewEngine
{
    public HtmlViewEngine()
    {
        FileExtensions = new[] { "html" };

    }
}