Альтернатива для компонентов * Ngfor

Есть ли лучшее решение в Angular 5?

<div *ngFor="let component of components | async">
    <component-1  *ngIf="component.type === 'some-type-1'"></component-1>
    <component-2  *ngIf="component.type === 'some-type-2'"></component-2>
    <component-3  *ngIf="component.type === 'some-type-3'"></component-3>
</div>

ngfor angular5
person Retr Wood    schedule 09.04.2018    source источник
comment
Вы можете создать другой список, содержащий типы, и с помощью второго цикла * ngFor вы сравните типы   -  person br.julien    schedule 09.04.2018

Ответы (1)


arrow_upward
0
arrow_downward

В качестве альтернативы вы можете использовать настраиваемый канал для фильтрации компонентов по типу. Очевидно, вы можете настроить свою трубу так, чтобы она лучше соответствовала свойствам ваших компонентов.

<div *ngFor="let component of components | myfilter: 'some-type-1'">
    <component-1></component-1>
</div>

<div *ngFor="let component of components | myfilter: 'some-type-2'">
    <component-2></component-2>
</div>

<div *ngFor="let component of components | myfilter: 'some-type-3'">
    <component-3></component-3>
</div>

Рабочая демонстрация

person bugs    schedule 09.04.2018