super-simple example of using a directive at a custom tag in an AngularJS 1.5.8 application

Assuming the HTML at the top of this, let's place a new tag just inside the first div tag with the ng-app on it like so:

<add-Intro></add-Intro>

 
 

Alright, our directive itself looks like so:

app.directive("addIntro", function () {
   return {
      template: "Books by George R. Martin:"
   };
});

 
 

Notice that the names don't match up one for one. You will have a directive name in camelCase and when you call to it with a tag in the markup then the names get hyphens between the words. Whatever. The copy in the template ends up painted to the screen at the tag's locale. Yippee! Anyways, if this seems like a pretty weak blog posting, it really is a wrap-up of a series of other blog postings. This is the sixth of six blog postings in which I build out an AngularJS app. I worked with Angular for like two weeks at @hand three years ago and of course I've forgotten it all so I've been trying to refresh myself. If you follow the following postings you could build out an app yourself!

• i.
• ii.
• iii.
• iv.
• v.
• vi.

I think it's neat that the first eight Roman numeral numbers come in alphabetic order, though I suppose that's off topic, eh? Anyways, I recommend just pulling Angular 1.5.8 from NuGet in Visual Studio and building out inside of the first web page your application surfaces when you run it. Add script tags for angular.min.js and angular-route.min.js. Hmmmm... I'm not sure I needed angular-route.min.js.