我在Angular 2项目中使用jQuery DataTables插件,在渲染函数返回的模板字符串中使用Angular 2自定义组件时,我面临以下问题。这是代码片段:
@Component({
selector: 'my-custom-grid',
templateUrl: './my-custom-grid.html',
styleUrls: ['./my-custom-grid.less'],
encapsulation: ViewEncapsulation.None
})
export class MyCustomGridComponent implements OnInit {
constructor() {}
ngOnInit() {}
dataGridConfig:any = {
"paging": false,
"info": false,
"destroy": true,
"columns": [
{
data: 'customerName',
title: 'CUSTOMER NAME',
render: function(data, type){
return "<span *ngIf='someBoolean'>Welcome Text</span><my-
new-component></my-new-component>";
}
}
],
"fixedHeader": true,
"scrollX": true,
"scrollCollapse": true,
"dom": 't',
"order": [[ 1, 'asc' ]],
"responsive": false
};
}
当我在上面的渲染函数中使用它时,问题是Angular 2没有编译*ngIf
和<my-new-component></my-new-component>
。
为什么会这样?有没有办法在jQuery DataTables的渲染函数中使用Angular 2/4自定义组件和结构指令?