AngularJS Directive template not rendering
angularjs, javascript
Solution
With a directive named:
app.directive("exampleText", ...
HTML should be:
<example-text></example-text>
From documentation:
Angular normalizes an element's tag and attribute name to determine which elements match which directives. We typically refer to directives by their case-sensitive camelCase normalized name (e.g. ngModel). However, since HTML is case-insensitive, we refer to directives in the DOM by lower-case forms, typically using dash-delimited attributes on DOM elements (e.g. ng-model).
Problem
I have a simple directive that just displays some text for now: ``` app.directive("exampleText", function() { return { restrict: "E", template: '<div>hello!</div>' } }); ``` In my index.html I have this: ``` <div class="container" ng-app="customerPortalApp"> <div ui-view></div> <exampleText></exampleText> </div> ``` `exampleText` is outside my `ui-view` as thats to do with my routes and works correctly. But its my understanding the directive template should render as is. Have I missed something?