[AngularJS] Taking control of your templates using $templateCache

Using $templateCache for quickly retrieval from the cache after first time used.

$templateCache mainly can use two methods:

get(id)

put(id, "your html code here")

angular.module('app', [])
.directive('myButton', function () {
return {
templateUrl: 'timestamp'
}
})
.run(function ($templateCache) {
$templateCache.put('timestamp', '<button>' + Date.now() + '</button>');
});

or you can but your template in the <script> tag, then use templateCache.get() method:

<script type="text/ng-template" id="templateId.html">
<button>Date.now()</button>
</script>

angular.module('app', [])
.directive('myButton', function ($templateCache) {
return {
templateUrl: $templateCache.get('templateId.html')
}
})