如何在JSP页面中包含angular2/4组件?

2024-02-23

我想在JSP页面中添加角度组件,有哪些可能的方法?

描述更多:

我在 JSP 中有一个应用程序动态 Web 应用程序,我创建的另一个应用程序是一个执行一些身份验证的角度组件。 除了 object、embedd 或 iframe 之外,还有其他方法可以在 JSP Web 应用程序中使用此组件吗?


我可以通过将我的角度组件引导到我的应用程序中来将其包含到 jsp 中,并且它运行良好。 以下是这样做的一种方法。另外,您还可以包含整个组件代码和引导角度模块。

  1. 将以下脚本包含到您的index.jsp 中。这里my-app是我的组件的名称
    <script src="node_modules/@angular/common/common.umd.js"></script>
    <script src="node_modules/@angular/compiler/compiler.umd.js"></script>
    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/reflect-metadata/Reflect.js"></script>
    <script src="node_modules/rxjs/bundles/Rx.umd.js"></script>
    <script src="node_modules/@angular/core/core.umd.js"></script>
    <script src="node_modules/@angular/platform-browser/platform-browser.umd.js"></script>
    <script src="node_modules/@angular/platform-browser-dynamic/platform-browser-dynamic.umd.js"></script>

    <!-- Our app -->
    <script src="app.js"></script> 
  <body>
  <my-app></my-app>
  <body>
  1. 创建 app.js 文件,它将引导您的角度组件。

app.js

(function() {
  var MyApp = ng.core.Component({
      selector : 'my-app',
      template : '<h1>Hello Angular 2!</h1>'
  }).Class({
      constructor : function() {
      }
  });

  document.addEventListener('DOMContentLoaded', function() {
      ng.platformBrowserDynamic.bootstrap(MyApp);
  });

})();

有关更多信息,您可以阅读引导角度应用程序。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在JSP页面中包含angular2/4组件? 的相关文章

  • 在 Angular 9 应用程序的生产中同时使用 AOT 和 JIT

    因此 我一直在构建一个 Angular 9 应用程序 其中有一个客户仪表板来管理保存在服务器上的模板 这些模板可以通过激活系统在不同的设备上查看 因此设备与用户绑定 所以让我们说https templates com我们有 login da
  • Spring Boot 中的 JSTL 支持

    虽然我知道有JSP 支持中的一些限制 http docs spring io spring boot docs current reference html boot features developing web applications
  • 为什么 Angular 2 项目如此大 [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我们正在用 ng2 重写 ng1 项目 我们的 ng1 项目构建后大约有 8mb 我们对 ng2 的重写已经完成了大约四分之一 并且我
  • Windows 10 中的 npm 安装错误( npm install -g angular-cli )

    node v v4 5 0 npm v 5 0 1 有人在 Windows 10 中安装 angular cli 时遇到过这种问题吗 请尝试以下操作 step 0 运行这个命令 npm uninstall g angular cli npm
  • Angular2 Router:将主题标签添加到 url

    我正在使用 Angular2 Seed 应用程序 您可以在官方仓库 https github com mgechev angular2 seed 正如您所看到的 这里我们导入了 angular2 router 并且我们使用它来创建应用程序的
  • 没有导出的成员/节点模块

    我刚刚开始使用 5 分钟快速入门找到的 Angular 2 Typescripthere https angular io docs ts latest quickstart html 我遇到了一个看起来很常见的问题 但可能有点不同 我遇到
  • 全局未在 ../node_modules/socket.io-parser/is-buffer.js 中定义

    预先感谢您帮助我 我正在尝试在我的一个角度组件中连接套接字 但在浏览器的控制台中它会抛出一个错误 指出 Global 未在 Object node modules socket io parser is buffer js 中定义 这是我的
  • 创建 AoT 兼容的服务工厂

    我正在尝试为缓存服务创建一个服务工厂 主要要求是每次可以使用不同的字符串实例化单个服务 最终的结果会有多个cache每个服务都由唯一定义databaseName 每个缓存可以有一个或多个stores也由唯一定义storeName 其他服务将
  • JSP:未评估 EL 表达式[重复]

    这个问题在这里已经有答案了 我有一个在 Tomcat 5 5 上运行的 JSP 页面 我有以下代码
  • 使用 facebook 共享动态更新元标签 - Angular 6

    我需要动态更新元标记 如 og title og description 和 og image 并在 facebook 上共享相同的内容 我已经尝试了所有方法 但没有任何效果 首先 我尝试使用 javascript 设置元标记 如下所示 v
  • Angular 2:基于环境导入服务

    根据 Angular CLI 项目中的当前环境导入服务的最佳 正确方法是什么 我已经设置了一个名为 dev mock 的新环境 我可以使用它来调用 ng serve environment mock 然后我使用 useClass 在模块中设
  • FakeAsync/tick (Async/whenStable) 与 detectorChanges()

    您能帮我区分这两件事吗 根据我的理解 如果你只使用 observable 你可以使用 detectorChanges 因此 您可以直接更改组件属性或监视服务调用并返回可观察的值 然后调用 detectorChanges 更改将在 html
  • 原生元素聚焦功能不起作用

    我试图通过单击按钮自动聚焦在输入元素上 请参阅打字稿 ViewChild envFilter envFilter ElementRef onFilterSelect this envFilter nativeElement focus 在
  • Angular 2 获取当前路线

    所以我需要以某种方式检查我是否在主页上执行某些操作 而在其他页面上则不执行此操作 该组件也在所有页面上导入 如果我在主页上 如何检测该组件 Thanks 尝试这个 import Router from angular router expo
  • 在 Fabric.js 中按宽度/高度在另一个画布对象内居中和缩放画布对象

    Goal 将一个对象 水平和垂直 置于另一个对象 矩形或组 的中心canvas via Fabric js或者通过Javascript保持原始对象的长宽比相同 但也不超过父对象的宽度 高度比例 父对象 矩形或组 不会居中于canvas元素
  • 设置 Angular 2 http 请求的基本 url

    我正在尝试为所有 Angular 2 http 请求设置基本 url 以下是我的应用程序的基本设置 class HttpOptions extends BaseRequestOptions url string http 10 7 18 2
  • 已做出回应

    我有一个取消按钮 用于刷新值 现在我已将它们转换为刷新或重新加载页面并移至只读页面 因此更改了取消按钮来调用这样的函数 function chkArea var url
  • Angular - 如何解析 event.path 内的对象

    现在这是一个很难解释的复杂问题 我会尽力解释 我有一个弹出窗口 我想从中唯一地标识单击事件是来自弹出窗口内部还是外部 我的第一个方法 我用一个包住了整个弹出框div与id 说 独特 因此 我将单击事件与主机侦听器绑定 我将为其获取事件对象
  • 如何比较 Struts 2 中 url 请求参数中的单个字符

    我正在读取具有单个字符的 url 参数 它将是Y or N 我必须写一个条件来检查它是否Y or N并做相应的事情 这是我写的 但似乎不起作用 总是转到其他地方 网址是
  • 模块“””在 ionic 3 Geolocation 中没有导出成员“NativeGeocoderReverseResult”

    模块 没有导出成员 NativeGeocoderReverseResult L13 从 ionic native geolocation ngx 导入 Geolocation L14 导入 NativeGeocoder NativeGeoc

随机推荐

  • 使用 Yammer 嵌入和开放图设置默认目标组

    我正在使用Yammer 嵌入 https developer yammer com connect 外部 Web 应用程序中的 JavaScript 控件 我想使用开放图功能 以便将所做的评论链接回创建它们的页面 这一切都非常简单 但我的问
  • 如果安装了 .Net 4.5,如何保持 .Net 4.0 行为?

    我们有一个面向 Net Framework 4 0 的 Windows 窗体应用程序 安装 Net Framework 4 5 后 应用程序开始崩溃 我们必须调查崩溃事件 并且很可能必须修复我们这边的问题 但是 在我们准备好使用 Net 4
  • 如何栅格化球体

    所以 我试图创建一个外部有 块 的球体 有点像在 Minecraft 中构建的 我不知道圆的外部的术语是什么 问题是 我不知道如何让像中点圆算法这样的方程适用于球体 最好是在 lua 或 java 中 这样我可以更轻松地阅读任何答案 我不想
  • @with_kw 在 Julia 中做什么?

    我正在阅读一些代码 如下所示 with kw struct HyperParams batch size Int 128 latent dim Int 100 epochs Int 25 verbose freq Int 1000 outp
  • TypeError:在 Xubuntu 14.04.5 上尝试 Selenium 时,urlopen() 获得了关键字参数“body”的多个值

    环境 lsb release a No LSB modules are available Distributor ID Ubuntu Description Ubuntu 14 04 5 LTS Release 14 04 Codenam
  • java中可以将字符串转换为数学运算吗?

    我可以将像 3 3 3 这样的字符串转换为java中的数学运算吗 使用 JavaScript 来评估它脚本引擎 http docs oracle com javase 6 docs api javax script ScriptEngine
  • AWS Lex Python Codehook 参考

    我对 Python 和编码 还很陌生 但我正在尝试使用 Lambda 函数构建自己的 Lex 机器人 我一直在关注教程 我可以理解它是如何工作的 问题是 当我尝试为 Lex 编写自己的 Lambda 函数时 我找不到任何参考来帮助我编写代码
  • 将带逗号的字符串转换为数组

    如何将字符串转换为 JavaScript 数组 看代码 var string 0 1 var array string alert array 0 在这种情况下alert shows 0 1 如果它是一个数组 它会显示0 而如果alert
  • 使用 .net SDK 从 Amazon S3 存储桶下载文件夹

    如何使用 net sdk 下载 s3 存储桶中存在的整个文件夹 尝试使用以下代码 它会抛出无效密钥 我需要下载存储桶中存在的嵌套 pesudo 文件夹中存在的所有文件 并将文件下载限制删除为默认值 1000 public static vo
  • 如何在Retrofit-2.0+ android中设置超时

    我提到这个链接 https stackoverflow com a 29380845 1083093但我似乎无法实现我的 我在用 compile com squareup retrofit2 retrofit 2 0 2 compile c
  • 将 Drupal 用户帐户导入 Rails,无需用户更改密码

    我想将一系列 Drupal 用户帐户导入到new铁轨项目 我正在使用 Devise 在 Rails 中进行用户身份验证 我希望能够将加密密码从 Drupal 导入到 Rails 中 以便用户在网站迁移时获得无缝体验 关于如何做到这一点有什么
  • 为什么 git revert 在这些情况下表现不同?

    假设我有ProjectA and ProjectB其中我只有一个名为test txt在这两个项目中并使用 git 跟踪它 第一次提交后 两个项目中的文件内容如下所示 one two three four 第二次提交后 两个项目中的文件内容如
  • dompdf:A4页面上的白边距

    我正在使用 dompdf 一个 PHP 库 创建 PDF 页面 但在设置正确的尺寸时遇到问题 当我使用 CSS 属性时 page size 21cm 29 7cm 例如 我想要页面的上半部分为红色 PDF 文件没问题 但打印后我得到了白色边
  • 如果我更改操作系统时区,事件(作为 json feed)、开始结束参数 unix 时间戳会有所不同

    我正在使用 fullcalendar 插件 如果有人可以帮助我 我将不胜感激 我通过 PHP URL 获取 json 事件 像这样的东西 calendar fullCalendar events myfeed php 因此 在返回事件的 p
  • Springboard 无法启动应用程序,错误为 3、0、4 等

    为什么 Xcode 无法在模拟器中启动应用程序 我在网上浏览了很多解决方案 但有时有效 有时无效 很多时候我解决问题的方法就是退出模拟器 删除应用程序 重置模拟器的内容设置 并清理和构建 但为什么我每次都要尝试其中的任何一个 所有 呢 Xc
  • 从命令行启动 Beyond Compare

    我已安装 Beyond Compare 3 C Program Files Beyond Compare 3 BCompare exe 和西格温 C Cygwin bin bash exe 我想要的是能够使用诸如以下的命令 diff
  • 核心图形和 GIF 颜色表

    我试图限制动画 GIF 的颜色数量 由一系列CGImageRef 但是 我在实际设置自定义颜色表时遇到困难 有谁知道如何使用核心显卡来做到这一点 我知道kCGImagePropertyGIFImageColorMap 下面是一些测试代码 大
  • 如何使用 $util.error 在 AppSync 中发送自定义错误

    我对 AppSync 错误处理有疑问 我想发送errorInfo对象以及错误响应 我尝试过 util error 根据文件 https docs aws amazon com appsync latest devguide resolver
  • 如何更改 Rails 中的 URL

    我有一个名为 Book 的资源 然后我有如下域 domain com books 272 但我想把它改成 domain com stories 272 仅针对 URL 不需要更改控制器 类等 在我有的路线中 map connect cont
  • 如何在JSP页面中包含angular2/4组件?

    我想在JSP页面中添加角度组件 有哪些可能的方法 描述更多 我在 JSP 中有一个应用程序动态 Web 应用程序 我创建的另一个应用程序是一个执行一些身份验证的角度组件 除了 object embedd 或 iframe 之外 还有其他方法