如何将我的Extjs 4.2.x项目放在最新的Angular App中

时间:2018-01-30 14:58:12

标签: angular extjs4 angular5 extjs4.1 extjs4.2

我在Ext4.2.x中构建了一个大型应用程序。现在要求是在Angular中进一步开发。 我试图在Ext应​​用程序周围创建一个Angular包装器,以便我们可以使用angular来逐个进一步开发/迁移代码。直到框架应该和谐地工作。

我正在尝试的方法:

  1. 我使用 angular-cli 创建了app(名称为: NgApp )脚手架,并将该代码放在Ext app的根目录中( ExtNg )。
  2. 创建了一个文件夹( ExtNg / NgBuild )来保存角度JS应用的构建文件( NgApp )。
  3. 内置角度应用: ng build -vc false -op C:\ Ext \ Ext6Grid \ ngBuild
  4. 我修改了 app.js autCreateViewPort: false,因此它会启动ext应用,但不会渲染它。
  5. 修改了我的Ext应用 index.html 主体,如下所示:

    <body> <app-root></app-root> <script type="text/javascript" src="ngBuild/inline.bundle.js"></script> <script type="text/javascript" src="ngBuild/polyfills.bundle.js"></script> <script type="text/javascript" src="ngBuild/styles.bundle.js"></script> <script type="text/javascript" src="ngBuild/main.bundle.js"></script> </body>

  6. 现在我尝试将我的Ext.onReady()代码放在 app.component.ts class&#39; ngOnInit()和指定的renderTo: someElemIDinAppComponentTemplate方法中启动Ext inside角度分量。

  7. 所以这里的问题正如预期的那样,在构建角度应用程序时,它找不到Ext对象,因为Angular作为框架不知道Ext是否存在。

    所以有人可以帮助我在我的角度应用程序组件中获得Ext吗? 所以想与那里的所有天才分享。

    我很乐意提出任何建议。 谢谢。

1 个答案:

答案 0 :(得分:0)

我认为你是从错误的角度研究这个问题。我建议您可以构建角度应用程序,并将您的ExtJS组件放在该东西中,而不是相反。

在这里,您对所尝试的内容采用了近似的方法:https://www.sencha.com/blog/first-look-ext-js-bridge-to-angular-2/

我想相信“The Bridge”也与新的Angular版本兼容。