Невозможно получить директиву Angularjs для отображения в поле зрения

Question

Пожалуйста, поверьте, я все перепробовал. Но что бы я ни делал, я не могу заставить созданную мной директиву заголовка отображаться при рендеринге main. html. Что мне не хватает. Любая помощь очень ценится! Спасибо

Вот мой компонент header.com. js

angular.
    module('header')
    .directive('header', function () {
        return {
             restrict: 'E',
             templateURL : 'app/Shared/header.html',
        }
  
    });

header.module. js

angular.module('header', ['ngRoute', 'ngMaterial', 'ngMessages']);

header.html
<div>
    <md-menu-bar>
        <md-menu>
            <md-button ng-click="vm.openMenu($mdMenu, $event)">
                Joe Porter
            </md-button>
            <md-menu-content>
                <md-menu-item>
                    <md-button>
                        Logout
                    </md-button>
                </md-menu-item>
            </md-menu-content>
        </md-menu>
    </md-menu-bar>   
</div>

main. html

<div header></div header>
<div class="container ">
    <center>
        <h1>

main.module. js

angular.module('main', ['ngRoute', 'ngMaterial', 'ngMessages', 'header']);

Answer 1

Кажется, вы активируете свой header только через restrict: 'E', что является сокращением от Element, что означает, что он запускается только тогда, когда вы пишете как элемент <header />. Итак, чтобы работать с атрибутом, вы просто добавляете еще A, который является атрибутом:

return {
  restrict: 'EA',