javascript - 如何在 Directive Link 函数中为变量添加 TemplateURL？

Question

如何在指令中的链接函数中包含模板 URL？我正在尝试做这样的事情:

app.directive('something', function($compile,$timeout) {

   return: {

      link: function(scope,element,attrs) {

           var htmlText = ???? // HOW TO INCLUDE A TEMPLATE URL HERE??

            $compile(htmlText)(scope, function(_element,_scope) {
         element.replaceWith(_element);                 
    });

      }, 

   }

}); 

当我搜索时，我了解到 Angular 指令可以使用 templateUrl。但我正在尝试将 html 代码存储到放置在 link 中的变量中，该变量最终会被编译。通常对于小代码，我只是将 HTML 内嵌到 var htmlText 中。但是如果我有很多代码，我想将其保存到一个单独的 html 文件中，然后为该变量调用它(如上例所示)。所以我的问题是

1) 如何为 link 中的变量添加指向模板 URL 的链接？

2) 添加 url 路径时，添加 index.html 文件所在的相对路径还是指令文件所在的路径？

Answer 1

好吧，要解决这个问题，您可以使用 ng-include在正常情况下 <div>你用 $compile 渲染的，所以像这样:

link: function(scope,element,attrs) {

       var htmlText = '<div ng-include="path/to/template.html"></div>';

       $compile(htmlText)(scope, function(_element,_scope) {
       element.replaceWith(_element);                 
});

[编辑]

this Thread. 中有更好的解决方案 路径取决于您的 Web 服务器的配置方式。但通常是的，它是您的 Index.html 的相对路径。