Question

我有一些数据：

$scope.posts = [ 
    { 'name' : 'post1', 'templateName' : 'template1.html' }, 
    { 'name' : 'post2', 'templateName' : 'template2.html' }
]

...我有两个模板：

<script type="text/ng-template" id="template1.html">
   <p><span>{{post.name}}</p></li>
</script>
<script type="text/ng-template" id="template2.html">
   <p>{{post.name}}</p>
</script>

将它们插入由$scope.posts支持的列表中，而<li ng-repeat="post in posts"></li>依次列出：

$scope.posts

如何迭代'templateName'并根据post.name插入正确的模板，还会将其填充为{{1}}？

Answer 1

我会使用ngIf来做这样的事情，你也可以使用ngSwitch

<p ng-if="post.templateName == myTemplate"></p>
<p ng-if="post.templateName == myOtherTemplate"></p>

Answer 2

所以我最终做了以下事情：

<li ng-repeat="post in posts">
    <ng-include src="post.template"></ng-include>
</li>

Answer 3

为了安全起见：

<li ng-repeat="post in posts">
    <div ng-include="post.templateName"></div>
</li>

如果某些浏览器（IE）不喜欢非标准标签。

在Angular中有条件地添加模板

3 个答案: