Я хочу обернуть список элементов, но я хочу гибкость при поставке уникального шаблона.Создание универсального итератора списков в Angular 2
<list [items]="someItems">
<book-list-item><!-- Books, cars, dogs, whatever -->
</book-list-item><!-- This will contain a unique template -->
</list>
ListItemComponent
import { Component, Input } from '@angular/core';
@Component({
selector: 'list-item',
template: `
<div *ngFor="let item of items">
<ng-content></ng-content><!-- Whatever book-list-item contains -->
</div>`
})
export class ListItemComponent {
@Input() items: Array<any>;
}
BookListItemComponent
import { Component } from '@angular/core';
@Component({
selector: 'book-list-item',
template: `
<div class="row">
<div class="col-xs-6">Books</div>
<div class="col-xs-6">Rule</div>
</div>`
})
export class BookListItemComponent {}
Очевидно, что я бы прохождение книги как пунктов, но это всего лишь пример. Я могу получить что-то похожее на эту работу, но «Правило книг» печатается только в последнем элементе списка-списка (потому что Bootstrap).
Я действительно хочу понять, как передать общий компонент родительскому компоненту, который будет перебирать общий компонент как элемент в списке элементов. Может ли кто-нибудь указать мне в правильном направлении?