Angular 如何使用其他人不知道的组件（组合组件）？

我想创建一个使用其他组件的通用组件，但该通用组件没有对此组件的直接引用

换句话说，假设一个列表组件绘制了ListRow组件的列表，但使用该列表的组件希望使用特定的列表行，例如，扩展ListRow的MyCustomListRow

这个MyCustomListRow有一个特定的html模板，所以，我如何告诉List组件使用MyCustomListRow而不知道像MyCustomListRow这样的特定列表行

这里可以找到一个代码示例[

想要的结果是MyCustomListRow的列表，类似于

这是MyCustomListRow： 这是MyCustomListRow： 这是MyCustomListRow： 但我明白了

[对象] [对象] [对象] 或者只需要很少的代码修改

这是一个列表行： 这是一个列表行： 这是一个列表行： 列表 MyCustomListRow 使用列表的应用程序

---

我想你可能会有点混淆。{item}}用于文本插值。Angular不知道如何打印MyCustomListRow对象。请参阅my.ok，但我想使用MyCustomListRow的复杂模板，可能还有一些其他组件，因此，简单的字符串属性是不够的。

@Component({
    selector: 'list',
    properties: [
        'listRows: list-rows'
    ]
})

@View({
    template: `
      <ul>
          <li *ng-for="#item of listRows">
              <listRow >{{item}}</listRow>
              <input type="button" value="..." />
          </li>
      </ul>
    `,
    directives: [NgFor ] // , bind(ListRow).toFactory(ListBindingManager.ListRowFactory)
})


export class List {
    listRows: ListRow[];    

    constructor() {
        this.listRows = [];

    }
}

@Component({
    selector: 'listRow '
})
@View({
    template: 'this is a ListRow  :( '
})

export class ListRow {
    constructor() {
    }

}

@Component({
    selector: 'listRow'
})
    @View({
        template: 'this is MyCustomListRow  :)   '
})
export class MyCustomListRow extends ListRow {
    constructor() {
        super();
    }
}

@Component({
  selector: 'my-app',
  bindings: [ListBindingManager]
})
@View({
  template: `
    <list [list-rows]="myRows" >
    </list>
  `,
  directives: [CORE_DIRECTIVES, List]
})
export class App {
  myRows: MyCustomListRow[];
  constructor() {
    ListBindingManager.listRowBindings = MyCustomListRow;

    this.myRows = [];
    this.myRows.push(new MyCustomListRow());
    this.myRows.push(new MyCustomListRow());
    this.myRows.push(new MyCustomListRow());
  }
}