Угловая директива внутри ng-шаблона с модальным

Question

Мне интересно, как угловые работы с предзагрузочными директивами, так как у меня есть проблема с директивой, которая находится в теге <script> и ng-template.

Когда я приостанавливаю выполнение в hrome dev-tools во время загрузки исходного документа, я могу ясно видеть, что код внутри контроллера директивы не вызывается, если моя директива лежит в каком-либо произвольном шаблоне. Вот пример кода, когда, например, myDirective входит в index.html в составе MyModule .js модуля, также включены как в индексе, и в основном модуле приложения:

Это HTML какой-нибудь другой директивы, содержащие проблемное myDirective

<script type="text/ng-template" id="callThis"> 
    <myDirective></myDirective> 
</script>` 

и я называю его по щелчку с ngDialog как этот

ngDialog.open({ 
    template: 'callThis', 
    scope: $scope 
}); 

и он не может выполнить директиву, так как он не имеет каких-либо HTML для работы с (тыс ats ошибка, о некотором элементе html отсутствует).

Наконец вот код для модуля, который держит myDirective

angular.module('myModule', ['myDirectiveTemplates', 'myDirectiveDirective']) 
angular.module('myDirectiveTemplates', []).run(["$templateCache", function($templateCache) {$templateCache.put("myDirectiveTemplate.html","<h1></h1>");}]); 
angular.module('myDirectiveDirective', []).directive('myDirective', function ($window, $templateCache) { 
    return { 
    restrict: 'E', 
    template: $templateCache.get('myDirectiveTemplate.html'), 
    controller: function($scope) { 
     //some arbitrary code 
    } 
    }; 
}) 

Интересно, если я поставил <my-directive></my-directive> прямо в файл index.html он работает нормально, а код внутри контроллера загружается при запуске. Я не знаю, как это решить.

Answer 1

Из чего я понимаю эту проблему, вам нужно использовать службу компиляции $. Существует учебник здесь, которые могут помочь: $ компилировать

Причина дано в учебнике:.

«Новоиспеченный шаблон не наделен AngularJS полномочиями все же это, где мы используем $ компилировать услуги ...»

и цитировали из углового Docs:

компилирует кусок HTML строки или DOM в шаблон и прод uces a шаблонная функция, которая затем может использоваться для связи области и шаблона вместе.

Вот краткий пример кода, как в учебнике:

app.directive('contentItem', function ($compile) { 
    /* EDITED FOR BREVITY */ 

    var linker = function(scope, element, attrs) { 
     scope.rootDirectory = 'images/'; 

     element.html(getTemplate(scope.content.content_type)).show(); 

     $compile(element.contents())(scope); 
    } 

    /* EDITED FOR BREVITY */ 
});