Upgrade AngularJS to Angular 6 in Cordova App - angularjs

I have a Cordova app built using Angular 1 i.e. Angular JS. How I can upgrade the app yo latest angular version.
Will it require complete code re-write to TypeScript (TS)??

TypeScript is not a requirement for writing Angular 2+. However, Angular 2-7 does not have much in common with AngularJS as it doesn't have the same architecture or components. For example, from what i've read about it, AngularJS used a MVC model, Angular2+ does not.
So to answer your question, you will indeed need to rewrite most of your application. Going from Angular 2 to 7 is much easier as not much has changed.

Related

AngularJS component as a component in Angular 8

I have an AngularJS application(say x) which we were using as a directive in our other AngularJS applications before.
Now we are using Angular 8 for our new applications and we need to use the same AngularJS component(x).
Is there a way to do that without migrating the code of this component x to newer Angular version since the code of this component x is huge.
Someone told me to use micro frontend but i couldn't understand how to use that in this scenario.
Any thoughts/suggestions would be greatly appreciated!
One possible way is to transform your Angular 8 application in an hybrid application that can bootstrap each of the Angular and AngularJS parts. To do that your AngularJS app needs to be in 1.5
See this documentation to turn your app in an Hybrid app : https://angular.io/guide/upgrade
Then, you extract your AngularJS directive in a package that can be use in both applications and avoid duplicated code.
And maybe this old topic can help you :) : Use AngularJS directive in Angular Component

Difference between Angularjs and angular [duplicate]

This question already has answers here:
AngularJS vs Angular [closed]
(7 answers)
Closed 5 years ago.
What is the Difference between Angularjs and angular(eg. cli and versions)?
I want to work Angular but I don't know differences for select one of them. I googled but don't explicitly mention differences between them.
AngularJS is the first version of Angular.
AngularCLI is a tool used to generate angular components, They are not comparable.
What you might mean, is what is the difference between Angular and AngularJS.
The answer to this question is that AngularJS is the first version of Angular.
It works with javascript and it is still getting supported but it is not compatible with Angular.
I'd suggest you start with Angular (Can also be called Angular2 or Angular4).
It is very confusing, but to sum it up, AngularJS is an old version.
Angular is the newer version and since everyone is migrating to Angular.
I would suggest you learn Angular instead of AngularJS.
AngularJS typically refers to Angular 1, or the original angular which has some differences between Angular 2+.
Some of the logic and keywords are different from 1 to 2+.
Angular CLI is a command-line interface for the current version of Angular, Angular 4.
Angular CLI provides a generator/framework for a new project using Angular.
The current documentation on angular.io is in Angular CLI.
Angular CLI stands for Angular Command Line Interface. As the name says, it is a command line tool for creating angular apps. It is recommended to use angular cli for creating angular apps as you don't need to spend time installing and configuring all the required dependencies and wiring everything together.
angular-cli provides you with boilerplates and therefore, saves your time.
whereas AngularJS is a client side framework of JavaScript which is based on MVC Architecture and provides a Single-page application solution for dynamic websites.
If you want choose any technology then following points should be considered:
Code Re-usability
Maintenance of the existing code
Testing of the code
Modularity and Scalibility for Team Development

Use Angular 2 pages in Angular 1

Currently we have application developed in Angular 1.X but we don't want to migrate from Angular 1.X to Angular 2, Since it is very wast application it will require more effort. We want other way around . Can we use Angular 2 features within Angular 1.X Application. In future whichever pages is created should be in Angular 2 but need to be worked side by side with Angular 1.X .. Like calling new route or new component from Angular 2 from Angular 1.X. Please let me know whether its possible or not.
Thanks
Kind of. What you are looking for is an Angular Hybrid app. Here's an article to help with what you are looking for.
Yes, it is possible.
You can use the new angular components/modules in a legacy angular application (downgrading) or you can use legacy components in the a new angular application (upgrading).
There is a section on the angular webpage describing all this. Direct link is here
https://angular.io/guide/upgrade#using-angular-components-from-angularjs-code

Can I use Angular1 plugin in Angular2 application?

I am very new to Angular 2 and would like to know if Angular 1 plugins can be used in Angular 2. I have used ng-knob in ionic 1 app. Some suggested to use jQuery knob instead but I really want to use ng-knob as it has many more options.
Is it possible to use ng-knob in angular 2? Even if there is a harder way I would not hesitate to try it but I really wan't to use ng-knob.
Any help with sample code is greatly appreciated.
As Angular2 framework is different from Angular1 framework, I'm afraid to say that you can't use Angular1 plugin(s) for Angular2.
Angular2 is a new framework and recently became stable. So, if you are looking for Angular2 plugin(s), its very hard to find them(as of now) as community is still developing Angular2 plugin(s).
Check out the Upgrading with The Upgrade Adapter section in angular.io - point 2 and other sections till 8.
https://angular.io/docs/ts/latest/guide/upgrade.html
Use angular.umd.js file instead of angular.dev.js or angular.js for 2.x. It supports both angular1 application and angular2 application to run side by side. This way you can use 1.x plugin with angular 1.x application and still run angular 2.x application side by side. You can use Zone.js to merge two way binding between angular 1.x application and 2.x application.
But this can be complex and if you are not comfortable with advanced hacks, you should take the answer of using 1.x plugins in 2.x versions. Unless you are ready to port your 1.x plugin to 2.x plugin yourself.
Zone.js intro - https://www.youtube.com/watch?v=V9Bbp6Hh2YE Good resource from Misko.

NgUpgrade: Can I use Angular2 Component in app bootstrapped with `ng-app`?

If I want to use the Angular-upgrade module in my Angular1 application it seems like I have to bootstrap the whole app using Angular2's bootstrapping, including ditching the ng-app declaration. My team is very interested in graduating our apps' components over time to Angular 2, but touching the bootstrapping is a little too impactful for us at this moment.
In order to use the Upgrade Adapter do I have to transform the way my app bootstraps in order to use an Angular2 component? Is there anyway to use an Angular2 component in a full Angular1 app?
Here's a great article that describes multiple scenarios for upgrading, but none of them leave the app bootstrapped as a normal Angular1 app.
Short answer is No.
From angular documentation
Pure Angular 1 applications can be bootstrapped in two ways: By using
an ng-app directive somewhere on the HTML page, or by calling
angular.bootstrap from JavaScript. In Angular 2, only the second
method is possible - there is no ng-app in Angular 2. This is also the
case for hybrid applications. Therefore, it is a good preliminary step
to switch Angular 1 applications to use the JavaScript bootstrap
method even before switching them to hybrid mode.
For better understanding how upgrade works read this article from official documentation https://angular.io/docs/ts/latest/guide/upgrade.html

Resources