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

Question

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

suk*_*khi 5 jsp angular

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

描述更多：

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

Answer 1

suk*_*khi 2

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

将以下脚本包含到您的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>

Run Code Online (Sandbox Code Playgroud)

创建 app.js 文件，它将引导您的角度组件。

应用程序.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);
  });

})();

Run Code Online (Sandbox Code Playgroud)

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

归档时间：	8 年，4 月前
查看次数：	11773 次
最近记录：	5 年，6 月前