在带有母版页的.net ASPX页面中嵌入Angular应用程序

Question

我有一个ASP.NET Web应用程序，主页面包含标题，标签，BodyContent（每个页面内容都在这里），用户控件的页脚占位符（页眉，标签，页脚）和页面内容（MainContent）。选项卡用户控件具有无序的选项卡列表，例如我们将选项卡的文本视为TabOne，TabTwo，TabFour，每个选项卡单击一下，各个网页加载了一个带有以下代码行的javascript函数：

window.location.href = "TabOne.aspx";

现在我得到了一个新的请求，添加一个TabThree选项卡来加载一个角度页面，显示Header，tabs，footer和BodyContent保存角度应用程序的内容，即点击TabThree，我将在现有的ASP中加载一个角度应用程序。类似于引用链接的网络应用程序（How to include external Angular 2 app in ASP.NET Webforms aspx page）

//TabThree.aspx
<%@ Page Title="" Language="C#" MasterPageFile="~/Base.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Programs.Default" %>

<%@ MasterType VirtualPath="~/Base.Master" %>


<asp:Content ID="Header" ContentPlaceHolderID="Header" runat="server">
<%--<base href="/AngularComponents/">--%> //No difference with uncommenting the base href
<%--<base href="/">--%>
    <script type="text/javascript" src="../Tabs.js"></script>
</asp:Content>
<asp:Content ID="Tab" ContentPlaceHolderID="Tab" runat="server">
</asp:Content>

<asp:Content ID="BodyContent" ContentPlaceHolderID="BodyContent"   runat="server">

<div id="pageContent">
   <app-root>Loading...</app-root>
   <script type="text/javascript" src="AngularModules/inline.bundle.js"></script>
   <script type="text/javascript" src="AngularModules/main.bundle.js"></script>
   <script type="text/javascript" src="AngularModules/polyfills.bundle.js"></script>
   <script type="text/javascript" src="AngularModules/vendor.bundle.js"></script>
   <link href="AngularModules/styles.bundle.css" rel="stylesheet" />
 </div> 
</asp:Content>
<asp:Content ID="Footer" ContentPlaceHolderID="Footer" runat="server">
</asp:Content>

如果我独立运行角度应用程序，它会使用ng serve -o命令启动，并在URL（http://localhost:4200/#/TabThree?id=TID100）上显示正常。现在我已经将dist文件夹复制到ASP.NET Web应用程序工作区并将其重命名为AngularModules，单击TabThree我尝试将角度组件加载到Bodycontent中，其中一行代码用于导航：

window.location.href = "TabThree.aspx/#/TabThree?ID=TID100";

window.location.href = "TabThree.aspx?AngularComponents/#/TabThree?ID=TID100";

Head内容加载正常，但是应该加载TabThree的Angular组件的Bodycontent是空白的，控制台错误记录如下：

ERROR Sys.ParameterCountException: Sys.ParameterCountException: Parameter count mismatch.
"ERROR"
{
  [functions]: ,
  __ proto __: { },
  __zone_symbol__currentTask: { },
  description: "Sys.ParameterCountException: Parameter count mismatch.",
  message: "Sys.ParameterCountException: Parameter count mismatch.",
  name: "Sys.ParameterCountException",
  stack: "Sys.ParameterCountException: Sys.ParameterCountException: Parameter count mismatch.
  at String$startsWith (http://localhost:62557/ScriptResource.axd?

  d=gb2H0hcR0_2oXWpLxJmdTg2S_j-8tZAZO1r6sTjByVD4-_6_cs99E6CayZY9pi0-N-ip5bmZNlhZWaB-IG2xnFZG-NKKnY8LqkMvfx1uzDhC1zqaP8PQi4JB24Hq7urD6rwOMv6ZCQbxzc19pQ0mcl6iexnSPre_a0zN-jpBGmFTlZ5rxoZ47qCy4shfjh4T0&t=ffffffff87bbe9c7:494:12)
  at startsWith 

我引用了链接（Including an Angular2 application to Asp.Net Webforms Page），但这也没有解决问题，我无法在BodyContent占位符中将Angular组件作为Tab启动。

我已经研究了两个参考链接，但他们没有关于如何在ASPX页面中加载角度组件的路由/导航的正确信息。

我尝试过上面提到的其他方法，它们重定向整个页面并启动Angular应用程序作为独立的，但我的要求是将角度组件写入TabThree.aspx页面的Bodycontent，以便与其他Tabs / pages一致。

在混合应用程序中解决此路由问题的任何帮助都将是一个很大的帮助，我将不胜感激。

提前致谢！！

我没有找到相同的任何可能的重复，我也链接了引用，希望这没有标记为重复。