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...

AIR Local Database Helper Class

This is a quick little app that showcases a class I created (LocalDatabaseService.as) to take some of the boilerplate code out of dealing with the local database in AIR. You can create an ActionScript object and pass it into the createTable method and it will create the table for you by interrogating the AS object. You can then use the add, update, save, remove, getAll, and getByID methods by passing in an object along with the table name and a responder. There is still a lot I would like to do with this, and there is definitely some refactoring to be done, but I wanted to share just the same.

Requirement: Your ActionScript object must have an id property named "ID".

Next up, I am going to add some code to handle one-to-many and many-to-many relationships between objects. Maybe create some recursive saving and add a little documentation... but not tonight. :)

Enjoy...

Sample Application: IdeaBank

OnAir Bus Tour Review

I just got back to the hotel room from the Adobe OnAir Bus Tour in Atlanta. If you get a chance to catch it on one of the remaining stops, you owe it to yourself to do so. Kudos to the guys from Adobe for putting on a great show. There was plenty of food, drink, and great presentations. I got the opportunity to meet Mike Chambers, Christian Cantrell, Kevin Hoyt, Ben Forta, Daniel Dura and several local/regional developers. Everyone was very nice, and I got several questions answered straight from the horses mouth, so to speak. It looks like there is some really cool stuff on the horizon AIR.

OnAir Bus Tour

Long time no blog. :( I've been pretty busy at work, and as a result my blog has suffered. Well, time to change that.

I just arrived in Atlanta for the OnAir Bus Tour at the Fox Theater. Really looking forward to a full day of Adobe goodness. If your at the conference, track me down and say hi. I'll blog tomorrow night and let you know how it went.

My First Apollo App Revisited

I have just installed Flex Builder 3 beta and the new AIR runtime beta (that's a little redundant). To kick the tires so to speak, I updated my Apollo Video Player to the new and improved (not really) AIR Flash Video Player. I hope the name "AIR" will grow on me. Right now I'm not too sure about it. :)

Updating the code to jive with beta 1 went surprisingly well. The only code I had to change was one line that referred to "File.appStorageDirectory". The new method name is "applicationStorageDirectory". Piece of cake. Hope all of my other apps upgrade this easily.

Please let me know if you find any issues!

Download AIR Flash Video Player

Download Adobe Integrated Runtime

Flex 2 Developer Exam

The last few days have been good. First, my Flex/ActionScript posters arrived. Next, my Apollo Pocket Guide was delivered. Then yesterday, I passed the Flex 2 Developer Exam! Good week so far. :)

Funny thing about the posters, I am having trouble finding space on my office walls to put them. They are flipping huge!