如何在Angular 2中将数据传递给具有ng-content的子节点?

时间:2017-05-31 14:21:38

标签: javascript angular typescript angular2-template angular2-directives

我想为table / tr / td

创建通用组件

所以我有这个:

            <Datatable [data]="results">
                <DatatableColumn [field]="name">1</DatatableColumn>
                <DatatableColumn>2</DatatableColumn>
                <DatatableColumn>3</DatatableColumn>
                <DatatableColumn>4</DatatableColumn>
            </Datatable>

而且:

@Component({
  selector: 'Datatable',
  template: `
    <table>
        <tr #lineSelected *ngFor="let subscription of data">
            <ng-content></ng-content>
        </tr>
    </table>
  `,
  })
  export class DatatableComponent {

      @Input()
      data: Object;

  }

我想将数据传递给ng-content(必须显示<td>):

示例:<ng-content [dataRow]="subscription"></ng-content>

通过这种方式,我可以在我的Child组件中使用dataRow。像dataRow.field

这样的东西
 @Component({
   selector: 'DatatableColumn',
   template:`
     <td>
        dataRow.field
     </td>
   `
  })
  export class DatatableColumnComponent {
      @Input()
      field: String;
  }

我不知道如何写它。有什么帮助吗?

由于

0 个答案:

没有答案