Angular Custom Markup

How to create a markup. Note: compiler markup needs to be defined prior to calling. Putting the script after the html does not work.

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
<script src="http://fonts.googleapis.com/css?family=Roboto:400,300"></script>
<link rel="stylesheet" href="http://textangular.com/css/style.css">
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.13/angular.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/textAngular/1.2.0/textAngular-sanitize.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/textAngular/1.2.0/textAngular.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.js"></script>
<script src="http://resources.infolinks.com/js/infolinks_main.js"></script>
<body>
<div id="ng-app" ng-app="" ng-controller="demoController" class="ng-scope">
<br>
<div class="container">
<a href="http://github.com/fraywing/textAngular"> <img src="http://textangular.com/images/textAngularLogo.png" style="max-width:500%;" class="lighter"></a>
</div>
<br>
<div class="container border-around text-center lighter">
<span class="text-xlg roboto">A Lightweight, Two-Way-Bound &amp; Totally <b class="text-red">Awesome</b> Angular.js Text-Editor</span>
</div>
<div class="container lighter">
<div text-angular ng-model="htmlContent" name="demo-editor" ta-text-editor-class="border-around container" ta-html-editor-class="border-around"></div>
</div>
<br>
<div class="container text-center lighter border-around">
<div class="lighter roboto">
<p ng-bind="htmlContent" class="text-left text-med text-gray"></p>
</div>
</div><br>
<div class="container text-right">
<span class="well btn-md"><b>//cdnjs.cloudflare.com/ajax/libs/textAngular/1.2.0/textAngular.min.js</b></span>&nbsp;&nbsp;&nbsp;<a href="https://github.com/fraywing/textAngular/archive/v1.2.0.zip" class="btn btn-danger btn-lg">
<div><i class="icon-arrow-down"> </i><span>Download...

JavaScript

angular.module("textAngular", ['textAngular']);
function demoController($scope) {
$scope.htmlContent = '<h2>Try me!</h2><p>textAngular is a super cool WYSIWYG Text Editor directive for AngularJS</p><p><b>Features:</b></p><ol><li>Automatic Seamless Two-Way-Binding</li><li style="color: blue;">Super Easy <b>Theming</b> Options</li><li>Simple Editor Instance Creation</li><li>Safely Parses Html for Custom Toolbar Icons</li><li>Doesn&apos;t Use an iFrame</li><li>Works with Firefox, Chrome, and IE8+</li></ol><p><b>Code at GitHub:</b> <a href="https://github.com/fraywing/textAngular">Here</a> </p>';
};