Пользовательская Директива Элемента не работает

Question

Я создал директиву пользовательского элемента angularjs.По какой-то причине я не могу получить данные из директивы.Ниже приведено изображение структуры папки моего приложения

Структура папки приложения

directive.js

(function() {
    'use strict';

    angular.module('mymod')
     .directive('myDirective', function () {
         return {
             restrict: 'E', //E = element, A = attribute, C = class, M = comment         
             scope: true,

             templateUrl:'Views/Directives/Header/mytemplate.html',
             controller: 'controller',
             controllerAs: 'vm' 
         }
     });

})();

Controller.js (это контроллер директивы)

(function () {
    'use strict';

    angular
        .module('mymod')
        .controller('controller', controller);

    controller.$inject = ['$location']; 

    function controller($location) {
        /* jshint validthis:true */
        var vm = this;
        vm.title = 'controller';

        activate();

        function activate() { }
    }
})();

mytemplate.html

<div>
    Hello Directive
</div>

На главной html-странице, вызывающей директиву

   <my-Directive></my-Directive>