正确包含Angular指令的模板

我在写一个需要模板的Angular指令。在Angular中加载模板可以通过将模板本身嵌入源代码<script type="text/ng-template">中或在指令的配置中提供一个url来完成，例如templateUrl: "/path/to/template.html"。正确包含Angular指令的模板

对于第三方指令，第一种方法是完全不可接受的，因为人们不会npm install我的指令，然后做include("node_modules/mydirective/template.html")（或同等），它只是感觉脏。

第二种方法不会出于同样的原因。该模板将位于node_modules目录内，打包/部署网站后该目录不可公开访问。

我的想法是让开发者仅仅只包含模板指令本身包括以同样的方式：

<script type="text/javascript" src="/path/to/directive.js"></script> 
<script type="text/ng-template" src="/path/to/directive.html"></script>

的问题是，第二条线是不行的（浏览器会抱怨意外的字符，我想是因为它仍试图解析获取内容的JS。

我发现，使用的ng-include代替script src实际获取的模板。但问题是，由当时的模板是牵强，我的指令早已运行了link函数坠毁（因为找不到模板）。

有没有一种方法可以延迟我的指令，直到模板被提取或提供任何加载模板的方式？

来源

2016-03-07 alexandernst

尝试使用'ng-include'并将该模板放在js脚本之前。 –

@أنيسبوهاشم试过了，不起作用。 – alexandernst

赢得模板缓存！ https://docs.angularjs.org/api/ng/service/$templateCache – iH8

如何使用模板而不是templateUrl进行内联模板？如果它是一个库，我觉得这是捆绑指令和模板以供分发的最简单的方法

来源

2016-03-07 21:35:56 Jupo

它会工作（正如我在我的问题下面的评论中所说），但它感觉非常难看。 – alexandernst

推迟评估指令的一种方法是编写一个包装指令，对模板执行请求，然后执行$ compile和append请求回调中页面的初始指令。不过，并不漂亮。

来源

2016-03-07 21:42:02 Jupo

正确包含Angular指令的模板

回答

相关问题