Angular 8 ngIf создает пустой элемент, когда false - PullRequest
Новая
       4

Angular 8 ngIf создает пустой элемент, когда false

1 голос
/ 09 января 2020

У меня проблема с Anguar8 и ngIf:

У меня есть код, который создает div, который загружает некоторые изображения и их детали на страницу из json с условием:

HTML Код: 

        <div class="row" >
          <div class="col-md-2 col-6 col-sm-4" style="margin-bottom: 1em;" *ngFor="let item of product; let i=index"> <br>
            <div class="box" *ngIf="i>35">
              <img [src]="item.photo" alt="image slide" style="display: block; width: 100%;">
              <div class="text-center">
                <h6>{{item.name}}</h6>
                <h6>MRP : ₹ {{item.price}}</h6>                
              </div>
            </div>
          </div>
        </div>

Проблема в том, что angular создает пустой div с этим комментарием: 

<div _ngcontent-oio-c3="" class="col-md-2 col-6 col-sm-4" style="margin-bottom: 1em;"><br _ngcontent-oio-c3=""><!--bindings={
  "ng-reflect-ng-if": "false"
}--></div>

Ответы [ 2 ]

1 голос
/ 09 января 2020

Вы можете написать *ngFor="let item of product | slice:0:35;". Ссылка https://angular.io/api/common/SlicePipe

0 голосов
/ 09 января 2020

Есть два варианта: 1.Вы можете отфильтровать список, используя трубу, чтобы избежать 2.Вы можете попробовать, это не должно создавать никаких шаблонов 

<div *ngIf="i>35; else noData">
	{{data}}
</div>
<ng-template #noData>
</ng-template>
...