Which Angular 2 aspects should I keep in mind while creating an Angular 1 application?

Question

I will soon have to rewrite a relatively big/complex web application in Angular 1.x. I still have to learn Angular 1.x. I know Angular 2.x will be entirely incompatible with 1.x, but is there anything I can do to prepare for a rewrite in Angular 2.x?

For example:

• Code stucture: can I separate code that will have to be thrown away from code that might be reusable? The current web application doesn't have a REST API so I assume at least the REST API I will write will be reusable for the 2.x version. But I'm concerned about the client side code here.

• Language choice: most likely I will be asked to use pure JS (the version consumed directly by the browser), but would it be wise to use Typescript instead to write the Angular 1.x app, since that's what Angular 2.x itself is written in?

• Anything else?

Answer 1

I would recommend using directives with their own "controllerAs" based controller. This gets you close to the Angular 2.0 component style. In fact it's very similar. Here is an example of what I mean:

http://www.syntaxsuccess.com/viewarticle/migrating-from-angular-1.x-to-angular-2.0

Answer 2

There is no reason to write Angular 2.x in Typescript except if you prefer it or want to contribute to the code or if something is not working, go through the Angular 2.x code to better understand it. Typescript doesn't make JS faster or anything like that, it just offers static typing which is used to aid development tools like the IDE you use. Think Visual Studio.

I'd suggest you start using ES6, which introduces classes (well syntactic sugar, js is still js) which Angular 2 uses, by using a transpiler to convert ES6 code to ES5 and which I reckon more and more people will use (to the horror of Crockford and others).

Don't use complex directive stuff like transclude, compile / pre-link etc, keep it simple since Angular 2.x is trimming down on the mindset of inventing new ways to confuse programmers. They aren't exactly the same thing but Angular 2.x will be based on components which is kind of similar to directives in the way they use template/view.

Get familiar with ES6 import/export.

Stray away from using $scope, it will be removed in its current form.

I wrote a bit more detailed blog post about it actually, http://www.alajmovic.com/2015/07/18/preparing-for-angular-2.html