Question

另一个团队（阅读外包）编写了一个Angular 2应用程序，然后将编译后的文件发送给我们。

如何在我的aspx页面中包含这些（现在）的js文件？它不能那么简单：

$('input').focus(function(e) {
var name = $(this).attr('name');
if ($('label[for="'+name+'"]').length > 0) { 
    $('label[for="'+name+'"]').addClass('active');
}});

$('input').blur(function(e) {
var name = $(this).attr('name');
if ($('label[for="'+name+'"]').length > 0) { 
    $('label[for="'+name+'"]').removeClass('active');
}});

可以吗？我会假设我需要调用一个函数来导致javascript文件触发？或者我没有正确地做到这一点，因为我一直在寻找的唯一解决方案是创建一个.NET核心或MVC应用程序然后添加Angular文件（我考虑过这种可能性）？

我对Angular 2几乎一无所知（我正在学习，但我不太了解产生专业质量的代码，特别是在我们目前的短时间表上），因此让另一个团队编写Angular代码。

非常感谢任何方向建议（我现在几个小时都在寻找答案）。

Answer 1

我在这篇文章中找到了答案： Angular2: Cannot read property 'call' of undefined (when bootstrapping) 在这篇文章中：Angular2 Selector did not match any elements with bundle and ECM6

具体来说，我需要设置Async =＆＃34; false＆＃34;在我的页面声明中，

<%@ Page Title="" Language="C#" MasterPageFile="~/CISBase.Master" AutoEventWireup="true" 
CodeBehind="Default.aspx.cs" Inherits="StudyPrograms.Default" 
MaintainScrollPositionOnPostback="True" Async="false" %>

使用EnablePageMethods =＆＃34; true＆＃34;，

添加ScriptManager

<asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true"></asp:ScriptManager>

然后按特定顺序调用我的脚本：inline，polyfill，vender，main。第二篇帖子专门用来在你的app标签之后调用你的脚本，即

... <app-root>Loading...</app-root> <script type="text/javascript" src="AngularModules/inline.bundle.js"></script> <script type="text/javascript" src="AngularModules/polyfills.bundle.js"></script> <script type="text/javascript" src="AngularModules/vendor.bundle.js"></script> <script type="text/javascript" src="AngularModules/main.bundle.js"></script> <link href="AngularModules/styles.bundle.css" rel="stylesheet" /> ... </asp:Content>

编辑：2017年11月我们一直在使用代码，发现地图文件是必要的。我们找到了命令

ng build --env=prod

比
效果更好
ng build --prod -output-hashing=none

因为前者提供了asp.net应用程序中所需的maping文件，以便一切正常运行。

Additinoally，我发现另一篇关于需要在index.html和app.modules.ts文件中添加一些代码的帖子：Set base href dynamically - Angular 2 / 4 关于设置

<base href=""/>

以便将角度应用程序附加到正确的url结构的末尾。

如何在ASP.NET Webforms aspx页面中包含外部Angular 2应用程序

1 个答案: