Writing a Directive for AngularJS 1.3 using TypeScript.
So what did I do? I wrote one of my directives using TypeScript, and you know what… It wasn’t bad at all!
Here’s how I did it.
I first wrote the test for my directive, then ran them with file watching to ensure that I could have these going in the background as I made the different changes in my code. This I think is crucial.
The next step involved writing a basic, non-trivial AngularJS 1.3 directive. The code looked like this:
After extracting the return function of the activityItem method to variables and adding the TypeScript styled type checking I ended up with two different files.
The first file (_app.core.ts) is a helper util that builds the directive:
The other file (activityItemDirective.ts) is the actual directive written in TypeScript:
Closing notes and thoughts:
- I’m using the AngularJS TypeScript declaration file found here.
- Aaron Holmes’ blog post got me thinking.
- This could be made better if the Controller and Link were moved into the IsolateScope — perhaps?