AngularJS – 在指令中加载动态模板HTML

前端之家收集整理的这篇文章主要介绍了AngularJS – 在指令中加载动态模板HTML前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个指令从外部 HTML文件加载内容.传递给该指令的是一些范围数据,用于呈现该HTML片段.例如

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

<! - 此处的其余内容 - >

< / DIV>

我想在这个指令中做的是根据传递给指令的原始范围数据在其中加载另一个HTML部分.我似乎无法让这个工作,但它应该是以下几点:

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

<! - 此处的其余内容 - >

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

< / DIV>

使用此文件,文件不会包含在内,但我也没有收到任何错误.有人可以帮我吗?

注意:我读了this,这是一个类似的问题,但没有帮助我.

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

最后通过在指令中声明以下内容找到了解决方案:
<div ng-include src="view.getView()"></div>

以及指令控制器中的以下内容

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

现在完美运作!

猜你在找的Angularjs相关文章