7

我有一个从外部 HTML 文件加载内容的指令。传递到该指令的是一些范围数据,用于呈现该 HTML 片段。例如

<div class="{{cls}}" data-obj="{{obj}}" data-id="{{id}}">

<!-- remainder of content here -->

</div>

我想在这个指令中做的是根据传递给指令的原始范围数据在其中加载另一个 HTML 部分。我似乎无法让它发挥作用,但它应该类似于以下内容:

<div class="{{cls}}" data-obj="{{obj}}" data-id="{{id}}">

<!-- remainder of content here -->

<div ng-include="partials/{{obj}}.html></div>

</div>

使用它,该文件不会被包含在内,但我也没有收到任何错误。有人可以在这里帮助我吗?

注意:我读过这个,这是一个类似的问题,但对我没有帮助。

更新- 我在 Chrome 开发工具中注意到 URL 正在按预期解析,但文件内容未包含在内。我从ng-include加载和编译请求的片段的文档中想到,所以我期待它能够工作。

4

2 回答 2

17

Found a solution in the end, by declaring the following in the directive:

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

and the following in the directive controller:

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

Works perfectly now!

于 2013-01-31T09:03:56.073 回答
1

在评论Shane Gadsby的评论时:不是<div ng-include src="'partials/'+{{obj}}+'.html'"></div>但是<div ng-include src="'partials/'+obj+'.html'"></div>。您的评论解释了为什么'这是您需要将其从对象文字强制转换为字符串',因此编译器将所有不在单引号中的内容作为范围对象处理。

于 2014-08-29T17:29:24.947 回答