Question

我在这里有此代码：

  <div *ngFor="let condition of interior_conditions; let i = index" class="condition-item-2">
    <div class="condition-title">{{condition.name}}</div>
    <div class="condition-content">
      <div class="row">
        <hr class="my-hr">
        <div class="col-12">
          <span *ngFor="let zone of zones">
            <span *ngFor="let poor_condition of zone.poor_conditions">
              <span *ngIf="poor_condition._id==condition._id" class="danger_zones">
          <span>
            Danger Zones:
          </span>
                {{zone.name}}
              </span>
            </span>
          </span>
        </div>
      </div>
    </div>
  </div>

事情是这样的：

我的数据库中有很多条件和区域
这些区域的条件差而且很好，它们可能只有良好的条件，不一定都具有
我遍历条件
后来，我遍历恶劣的条件
因此，如果某个区域的条件较差，我想打印区域名称，并且只将“标题”危险区域设置为一次

有什么想法吗？

Answer 1

假设您无法或不希望将跨度移动到循环之外，则可以基于索引添加一个ngIf：

<span *ngIf="i === 0"></span>

Answer 2

您应该移动标题为“危险区域”的跨度。

  <div *ngFor="let condition of interior_conditions; let i = index" class="condition-item-2">
    <div class="condition-title">{{condition.name}}</div>
    <div class="condition-content">
      <div class="row">
        <hr class="my-hr">
        <div class="col-12">
          <span *ngFor="let zone of zones">
          <span>
            Danger Zones:
          </span>
            <span *ngFor="let poor_condition of zone.poor_conditions">
              <span *ngIf="poor_condition._id==condition._id" class="danger_zones">
                {{zone.name}}
              </span>
            </span>
          </span>
        </div>
      </div>
    </div>
  </div>

Answer 3

我认为唯一可行的方法是通过服务，其中函数将输入条件并返回条件差的区域

当第一个ngIf发生在循环内时，在ngFor中仅调用一次div

3 个答案: