Изучив HTML и CSS вам предлагают обратить внимание, например, на препроцессоры или постпроцессоры CSS.
{{template}} следует использовать <div ng-bind-html="template"></div>
$scope.templatePath напрямую из контроллера недоступен в директиве. Соответственно, эту переменную надо передать в директиву через view. У меня это и делается через этот атрибут.
.directive("viewer", [
"templateCache",
function (templateCache) {
return {
scope: {
templatePath: "="
},
restrict: "AE",
link: function (scope, element, attrs) {
templateCache.get(scope.templatePath)
};
}
]);