2角多TemplateRef [英] Angular 2 multiple TemplateRef
问题描述
我想建立一个自定义的数据表格,可以显示无论是作为卡或更多的臣民表/表/网格数据。我能做到这一点很容易pretty如果我不想如本 plunker
I am trying to build a custom datagrid that can display data either as cards or the more tradional table/list/grid. I can do it pretty easily if I do not want the templates to be customizable as shown in this plunker
在这里,我有一个我的网
获取传递呈现的数据组件。然后,我在数据环和渲染卡视图
或列表视图
部件根据所需的看法是由视图切换
控制(code在应用程序/我-grid.ts
文件)
Here I have a my-grid
component that gets passed the data to be rendered. Then I loop over the data and render the card-view
or list-view
component depending on the desired view which is controlled by the view toggle
(code in app/my-grid.ts
file)
我要提供自定义模板传递的能力,我想是这样的:
I want to provide the ability to pass in custom templates and I am thinking something like this:
<my-grid>
<card-view-template>
<template var-item>
<h4>{{item.name}}</h4>
{{item.home}}
</template>
</card-view-template>
<list-view-template>
<template var-item>
<span>{{item.name}}</span>
{{item.home}}
</template>
</card-view-template>
</my-grid>
我要如何才能到达我想从我在哪里?
How can I get to what I want from where I am at?
推荐答案
我能解决我的问题,如图这里
I was able to solve my issue as shown here
import {Component, Directive, ContentChild, TemplateRef} from 'angular2/core';
@Directive({
selector: 'card-view'
})
export class CardViewComponent {
@ContentChild(TemplateRef) itemTmpl;
ngAfterContentInit() {
console.log('In CCV', this.itemTmpl)
}
}
希望它可以帮助别人说正面临着类似的问题。或者,也许有人能指出我到一个更好的解决方案。
Hope it helps anyone else that is facing a similar problem. Or maybe someone can point me to a better solution
这篇关于2角多TemplateRef的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!