javascript - AngularJS if 语句与 ng-repeat

Question

我在尝试将 if 与 repeat 语句一起使用时遇到问题。

我正在取数据，如下:

modules: Array[1]
    0: Object
        embed: "<iframe width="600" height="338" src="https://www.youtube.com/embed/UqdDAn4_iY0"
               frameborder="0" allowfullscreen="" style="margin:0px auto;display:block;"></iframe>"
        type: "embed"
    1: Object
        src: "https://m1.behance.net/rendition/modules/127899607/disp/072cebf2137c78359d66922ef9b96adb.jpg"
        type: "image"

所以，如果模块有图像类型，我想获取图像。如果它有嵌入类型，我想获取 iframe。我当前的 View 代码是:

<div ng-repeat="project in project.modules" ng-if="project.type == 'image'">
    <img src="{{ project.src }}"  class="img-responsive img-centered" alt="{{ project.name }}"/>
</div>

如果我去掉 ng-if，效果会很好。控制台输出以下错误:

Error: Multiple directives [ngRepeat, ngIf] asking for transclusion on: <!-- ngRepeat: project in project.modules -->

Answer 1

您可以使用过滤器而不是使用 ngIf。你的代码应该是这样的:

<div ng-repeat="project in project.modules | filter: { type: 'image' }">

它会起作用。

您尝试在代码中执行的解决方案无法完成，因为 ngIf 和 ngRepeat 都试图删除和替换一些元素并进行一些嵌入。

检查这个问题https://github.com/angular/angular.js/issues/4398

同时检查过滤器的使用 https://docs.angularjs.org/tutorial/step_09

这个问题对于将 ngRepeat 与过滤器一起使用很有用 ng-repeat :filter by single field