How can I put my Extjs 4.2.x project inside latest Angular App

℡╲_俬逩灬. 提交于 2020-01-05 08:01:45

问题


I have a large app built in Ext4.2.x. Now the requirement is to do further development in Angular. I am trying to create a wrapper of Angular around Ext app so that we can use angular for further development/ migration of code piece by piece. till the time both the framework should work in harmony.

Approach I am trying:

  1. I have created app(name is: NgApp) scaffolding using angular-cli and put that code inside the root directory of Ext app(ExtNg).
  2. Created a folder(ExtNg/NgBuild)to hold the build file of angular JS app(NgApp).
  3. Built angular app : ng build -vc false -op C:\Ext\Ext6Grid\ngBuild
  4. I have modified app.js autCreateViewPort: false so it will initiate the ext app but will not render it.
  5. modified my Ext app's index.html body as below:

    <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. Now I tried putting my Ext.onReady() code in app.component.ts class's ngOnInit() and specified renderTo: someElemIDinAppComponentTemplate method to start Ext inside an angular component.

So the problem here is as expected that while building angular app it does not find Ext object because Angular as framework dont know if Ext is there or not.

So could anyone help me getting Ext available inside my angular app's component?? So thought to share with all the geniuses out there.

I will be glad for any suggestions. Thank you.


回答1:


I think that you are looking into this issue from the wrong angle. I suggest that you may build the angular app, and put yor ExtJS components inside that thing, not the opposite.

Here, you have an approximated approach of what you are trying to do : https://www.sencha.com/blog/first-look-ext-js-bridge-to-angular-2/

I want to believe "The Bridge" is also compatible with new Angular versions.



来源:https://stackoverflow.com/questions/48524407/how-can-i-put-my-extjs-4-2-x-project-inside-latest-angular-app

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!