{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 爷、活的狠高调 的问题《How can I put my Extjs 4.2.x project inside latest》','https://www.manongdao.com/q-956296.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
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:
- I have created app(name is: NgApp) scaffolding using angular-cli and put that code inside the root directory of Ext app(ExtNg).
- Created a folder(ExtNg/NgBuild)to hold the build file of angular JS app(NgApp).
- Built angular app : ng build -vc false -op C:\Ext\Ext6Grid\ngBuild
- I have modified app.js
autCreateViewPort: falseso it will initiate the ext app but will not render it. 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>Now I tried putting my Ext.onReady() code in app.component.ts class's ngOnInit() and specified
renderTo: someElemIDinAppComponentTemplatemethod 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.
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.