Well I am well on my next chapter of AngularJS for my Stock application (Mogul Match Stocks) which follows the tenets of Rule #1, by Phil Town which I mentioned in my earlier post. BTW just to share a quick win with you, Rule #1 told be to buy Twitter before the huge run up on last Friday, I was up 20% as of this writing! Anyway back to the point of this piece. In building the application I was in need of a search function which would allow my users to search for a stock by typing in the first few letters of the company name or the first few letters of the ticker symbol. In the design of site, as you can see in the screenshot below, I was in need of a search box in a few places. AngularJS handles this scenario really well with directives! After building out by site with the search boxes as I wanted I began to test. During my testing of the solution I found my self hitting the enter key when I was done entering the letters for my query. Of course, I had not told the form to submit for the search box but only to submit when the little search icon was clicked. This became annoying and I figured that I would implement as my users might want to do the same.
I am currently learning AngularJS by building a web version of an old Stock picking application I previously published on Android and Windows Phone by the name of Stock Arbiter. The web version will have all the great features and follow the principles taught to me by Phil Town in his Best Selling book “Rule #1″ Disclaimer: I am not affiliated with Phil Town or Rule #1 in any way!. The idea of the application is to do much of the homework of finding a good stock for the end-user. The application will be updated and available on all major mobile platforms soon as well as the web!
Back to the topic of this post, in building the web application, I was in need of a revenue stream and figured Google’s AdSense was a good choice. However, I tried just inserting the Google AdSense code to my main Index page as instructed, however the ads were not coming through. After a little research I became obvious that the AngularJS framework was not processing the calls the Google AdSense API. Turns out I had to make this an AngularJS directive. So I figured I would share the steps to create this AngularJS directive with you: