Angular 2 Data Binding notes

Just some notes on the different ways to use data binding in Angular 2:

1. Interpolation - This is a one way binding from the class to the template.  You can use concatenation, calculations, and even call class methods inside the mustaches.  
1. <div>{{ someValue }}</div>
2. <div>{{7*4}}</div>
3. <div>{{'Title: ' + someValue}}</div>
4. <div>{{'Title: ' + getTitle()}}</div>
2. Property Binding - Sets an elements property to the value of a template expression.  The elements property is surrounded by square brackets, and the expression is surrounded by quotes.
1. <img [src]='someValue'>
3. Event Binding - Listens for events on the element and triggers class methods when the event occurs.  The event name is surrounded by parenthesis.  The class method is surrounded by quotes.  The event object is exposed by Angular through $event.
1. <div (click)='divClicked($event)'>Click Me!</div>
4. Two-way Binding - Utilizes ngModel to update a class property and the form element when the value is changed.  Two-way binding uses the "banana in a box" syntax.
1. <input [(ngModel)]='someValue'><div>{{someValue}}<div>

Let's Try This Again...

So, my last post was in 2007.  That was nine years ago.  Holy crap, time flies.

At that time I was all about Adobe Flex and Air.  But then, that all kinda went away...  Since that time, I've been developing in Javascript and it's multitude of libraries and frameworks.  At first, I went kicking and screaming.  I had done JS in the past and wasn't a big fan.  I had painful memories of trying to track down ridiculous bugs before we had the developer tools of today.  It took me a little while to get used to the shift from object oriented development, with the safety of interfaces, types, etc., to what looked to me like the wild west of Javascript.  "Wait a minute.  You can just pass objects around without any formal contracts?!?  Everyone has access to anything?"  It all seemed like a big step backwards.

Looking back, I think it was more of a step sideways.  I still mutter under my breath when I have to make style tweaks to compensate for one browser or another.  And I'm still looking forward to the day that the tooling catches up.  But the move to JS was a lot less painful than I had feared.  Of course, this was some 6 or 7 years ago now.  I've been involved with dozens of JS applications since then that utilized almost as many frameworks/libraries.

So that leads me to why I'm going to try to resuscitate this blog.  Over the last year or two, there have been a few frameworks/libraries that have sparked my interest.  Since the decline of Flex, I've been waiting for something to come along that was more component based.  That was one of the things I really loved and missed about Flex.  You could build small components and snap them together to build very complex UIs while still keeping things easy to reason about.  Some of the JS frameworks I have used in the past have come close, but the newer breeds (React, Angular 2, etc.) are finally there (I hope).  I can't say for certain that they fulfill the promise just yet.  I've done some small test projects with them, but no real world applications yet.  That should change soon.  I have a project on the horizon that will utilize Angular 2.  As a result, I'll be using this blog as a scratch pad to jot down my notes and findings along the way.  So, here we go...