在templateUrl中使用HTML文件的一部分

Question

有没有一种方法可以仅将文件的一部分用作指令的templateUrl ？ 例如，如果我有一个文件

<input type="text" data-name="first-name" />

<input type="text" data-name="last-name" />

<input type="text" data-name="address" />

etc.

有没有办法对角拉出来只有“第一名称” input标签或只有“姓氏” input标签，而不是使用整个文件？

我希望能够将多个指令的HTML内容作为单个HTML文件包含，因为仅一行代码似乎浪费了文件（UNIX哲学有其局限性）。 另外，在缩小过程中，我可能希望连接这些templateUrl文件，并且我想知道Angular不会为每个指令使用整个文件。

Answer 1

无法仅使用模板网址的一部分； 整个东西被拉入并编译。

对于简短的模板，我发现在模板中添加伪指令是一种最佳做法。 只需少量的html，减少上下文切换就值得，imo。

这可以通过更改标签从

templateUrl: 'foo.html' 

至

template: '<input type="text" data-name="address" />' 

希望有帮助！

Answer 2

AngularUI具有此功能。 在其UI-Utils软件包中， ui-include指令。 这与ng-include指令完全一样，只不过它允许一个额外的属性fragment本身包含页面的一部分而不是整个页面。

AngularUI UI-Utils页面上的示例代码演示得很好：

<ui-include src="'my/url/to/partial/file'" fragment="'#id-to-fragment'"></ui-include>
<!-- Don't forget to quote string literals! -->
<!-- Don't forget to include jQuery if you need full selector support! -->

当然，您可能已经包含了jQuery。 :)