angularjs 指令重用模板

Question

我正在 AngularJS 中创建一个上下文菜单指令。在我的网页中，我有一个项目列表，每个项目都有一个打开该上下文菜单的按钮。
由于屏幕上只有一个上下文菜单可见，我想创建一个菜单模板，每次单击上下文菜单按钮时，使用所选项目的数据更新模板。
我正在寻找的是一种重用模板元素的方法。

例如，如果我有 1000 个项目，则模板应该只为所有元素创建一次，而不是 1000 次。每当用户点击触发按钮时，该指令将使用带有项目数据的模板重新编译模板并将其附加到相关位置。

这在 AngularJs 中可行吗？如果是，实现它的最佳方法是什么？

Answer 1

您可以使用 ng-include，而不是一直创建指令：

https://docs.angularjs.org/api/ng/directive/ngInclude

您可以创建一个模板，然后将其包含在一个循环中。用正确的内容更新它的逻辑应该驻留在控制器中。

一个陷阱，你需要将模板路径作为字符串传递，例如

<span ng-include="'partials/folder/includes/my-template.html'"></span>

注意双引号后面的单引号。