在现有 ASP.NET WebForms 应用程序中使用 webcomponents答案

【问题标题】：Use webcomponents in existing ASP.NET WebForms application在现有 ASP.NET WebForms 应用程序中使用 webcomponents
【发布时间】：2017-02-03 01:45:25
【问题描述】：

我有一个大型的现有 ASP.NET WebForms 应用程序。这个应用程序有一个主页面，负责管理安全、导航、... 开发的页面位于 ContentPlaceHolder 中。

我想用 Web 组件在 JS 中开发新页面。要在页面上使用 Web 组件，必须将其导入 (<link rel="import" href="...">)。此导入必须位于页面的 <head> 部分。在我的例子中，<head> 在母版页上。所以我必须在母版页中导入所有现有的 Web 组件才能使用它们。

这听起来不是一个好主意。

否则我该怎么做？

【问题讨论】：

标签： asp.net webforms web-component

【解决方案1】：

Asp.Net 允许您将 ContentPlaceHolder 放置在 head 标签中。您可以加载页面所需的 Web 组件，而不是将它们全部加载到母版页中。

母版页

<html>
<head runat="server">
    <title></title>
    <asp:ContentPlaceHolder ID="cpHead" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ContentPlaceHolder ID="cpBody" runat="server">

        </asp:ContentPlaceHolder>
    </div>
    </form>
</body>
</html>

网络表单

<asp:Content ID="Content1" ContentPlaceHolderID="cpHead" runat="server">
    <link rel="import" href="...">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="cpBody" runat="server">
</asp:Content>

您的 HTML 将如下所示

<html>
<head>
    <title></title>
    <link href="..." rel="import">
</head>
<body>
</body>
</html>

【讨论】：

当然！我很惭愧......对不起这个愚蠢的问题。

【解决方案2】：

您通常会使用RegisterClientScriptInclude。这会将脚本文件添加到页面顶部，但不在<head> 中。

ClientScript.RegisterClientScriptInclude("myScript", "myJavaScriptFile.js");

如果你真的想在<head> 中使用它，你需要使用HtmlGenericControl

HtmlGenericControl genericControl = new HtmlGenericControl("script");
genericControl.Attributes.Add("type", "text/javascript");
genericControl.Attributes.Add("src", "myJavaScriptFile.js");
this.Page.Header.Controls.Add(genericControl);

将此代码放置在何处（母版、页面、用户控件）无关紧要。 Aspnet 将确保它们最终位于客户端的正确位置。

【讨论】：