Как связать настраиваемую директиву с внешним HTML-шаблоном в AngularJS?

Question

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

project 
-Lib 
    -MyCustomDirective(which i will use across multiple application) 
     -customDir.js 
     -customDirTmpl.html 
-app 
    -js 
     -myfirstcontroller.js 
     -main.js 
    -partials 
     -myfirstview.html 
    -index.html 

Итак, я планирую создать пользовательскую директиву, которую я хочу использовать в нескольких проектах. Проблема здесь в том, что я хочу сохранить шаблон для моей директивы в отдельном файле html. Когда моя директива загружена, мое приложение пытается найти «customDirTmpl.html», соответствующий текущему приложению, не относящемуся к моей папке «MyCustomDirective».

Я хочу, чтобы шаблон templateUrl моей директивы был таким же во всем проекте, я не хочу изменять его в соответствии с каким-либо конкретным проектом.

Sample код «customDir.js»

var myDir = function() { 
    return { 
     restrict: 'E', 
     //I want this to be constant accross which ever project i use this directive 
     templateUrl: 'customDirTmpl.html', 
     link: function(scope){ 
      //to do something 
     } 
    }; 
}; 

app.directive("MyCustomDir", [myDir]); 

Answer 1

хороший способ сделать это, чтобы иметь полезность в вашей директиве библиотеки проекта, который обрабатывает эти потребности.

Написание примера будет довольно утомительным, поэтому here является примером проекта ng-grid, который демонстрирует это. Посмотрите на функцию функции getTemplate.

И here это пример использования из того же проекта. Обратите внимание на использование gridUtil для извлечения шаблона.