각도 2의 일반 목록 반복자 만들기

Question

항목 목록을 묶고 싶지만 고유 한 템플릿을 제공하는 유연성이 필요합니다.

<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 {} 

분명히 내가 통과 할 것 책, 그러나 이것은 단지 예입니다. 이 작업과 비슷한 것을 얻을 수 있지만 "Books Rule"은 마지막 목록 그룹 항목에만 인쇄합니다 (부트 스트랩 때문에).

제네릭 구성 요소를 부모 구성 요소로 전달하여 일반 구성 요소를 항목 목록의 항목으로 반복하는 방법을 알고 싶습니다. 누군가 올바른 방향으로 나를 가리킬 수 있습니까?

Answer 1

this article을 살펴보십시오. 그것은 당신이 필요로하는 것과 매우 유사한 것을합니다. 귀하의 주요 도전 과제는 가치를 묶는 것입니다. 또한 Ben Nadel's article을 (를)보실 수 있습니다. 그것은 RC1과 관련이 있으며 심지어 주석의 언급에서 setLocal은 더 이상 존재하지 않으며 컨텍스트를 전달해야한다고 언급합니다.