AngularJS - 在指令内加载动态模板HTML

Question

我有一个指令，它从外部HTML文件加载内容。传递给该指令的是一些作用域数据，这些数据用于呈现HTML片段。例如：

在这个指令中，我想基于传递给指令的原始作用域数据，在其中加载进一步的HTML片段。但我似乎无法做到这一点，但应该是以下内容：

使用这个方法，文件不会被包含，但我也没有得到任何错误。有人可以帮助我吗？

NB：我阅读了this">这篇文章，它涉及类似的问题，但没有帮助到我。

更新 - 我在Chrome开发工具中注意到URL按预期解析，但文件内容未被包含。我从文档中了解到ng-include会加载并编译请求的片段，所以我原本以为它可以起作用。

- jwest

Answer 1

最终找到了解决方案，通过在指令中声明以下内容：

<div ng-include src="view.getView()"></div>

并且在指令控制器中添加以下内容:

$scope.view = {
    getView: function() {
        return "partials/" + $scope.obj + ".html";
    }
};

现在完美运作！

- jwest

---

你可以简化这个代码，问题在于它期望一个字符串而不是一个对象： <div ng-include src="'partials/'+{{obj}}+'.html'"></div>。 注意我在任何普通文本周围放置单引号，这是将其从对象文字强制转换为字符串所需的。 - Shane Gadsby

Answer 2

在回应Shane Gadsby的评论时：正确的代码不是<div ng-include src="'partials/'+{{obj}}+'.html'"></div>，而是<div ng-include src="'partials/'+obj+'.html'"></div>。 你的评论解释了为什么'this is what you need to force it from object literals to a string'，因此所有不在单引号中的内容都被编译器视为作用域对象。

- kinablej