Isolate State Mutations in Angular Components

Share this video with your friends

Send Tweet

Managing state is one of the hardest things to do in any application. Angular 2 tackles this problem by making it easy to implement a reactive, uni-directional data flow that favor immutable operations. We are moving in the right direction in Angular 1 by moving our state and logic to models but invariably this raises a question. If we are moving to an immutable world, how do you manage mutable operations like forms in Angular? In this lesson, we are going to learn a surprisingly simple technique to isolate state mutations within a component using component lifecycle hooks.

Mike
Mike
~ 8 years ago

Is there any reason you would choose Object.assign instead of angular.copy?

Lukas Ruebbelke
Lukas Ruebbelke(instructor)
~ 8 years ago

I generally prefer native implementations unless there are good reasons to use an alternate implementation. As far as I know there is not a version of angular.copy in Angular 2 while Object.assign is here to stay. With that said, you could use angular.copy and it would work just fine.

Yeray
Yeray
~ 8 years ago

Hi Lukas, Is there any advantage of using controllerAs syntax and not the value "$ctrl" set by default in the components

Lukas Ruebbelke
Lukas Ruebbelke(instructor)
~ 8 years ago

This is in part due to personal preference but I find that explicitly defining controllerAs is more self-documenting than using $ctrl across the board. I have also found that in pre-existing code bases, it helps with consistency as most everything else is using controllerAs.

Michael
Michael
~ 8 years ago

We've used typescript since day 1 with angular, am curious if you think this would be a viable approach https://hotell.gitbooks.io/ng-metadata/content/ for 1x code bases versus your es6 approach.

Lukas Ruebbelke
Lukas Ruebbelke(instructor)
~ 8 years ago

I definitely think that is a viable approach and for the most complimentary to my approach. I see the TypeScript approach being an extension of what I am talking about. ES6 and TypeScript are great because they encourage a better architecture at the language level.