Some might ask why?

Short Answer: Because you can.

Longer Answer: Because it's a framework I am comfortable working with.

At this stage I am just using Angular Material on this site but there is no reason why you couldn't also use angular and I have no doubt I will at some point.

So to get it to work add the code below to your 'Code injection' sections in Ghost. It's mostly just the required references (I have added material icons here also as I use them) and then the last script block is the code that binds Angular+Material to your page.

That's it!

James

Blog Header

<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css">

Blog Footer

<!-- Angular Material requires Angular.js Libraries -->
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>

<!-- Angular Material Library -->
<script src="http://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>

<!-- This binds angular to your page -->
<script>
document.getElementsByTagName("body")[0].setAttribute("ng-app", "ghostApp");
angular.module('ghostApp', ['ngMaterial']);</script>