angular alain框架st表格通过ng-template自定义列实现表格中添加下拉框

实现效果如图所示:

angular alain框架st表格通过ng-template自定义列实现表格中添加下拉框_第1张图片

首先~~在ts中columns中添加render属性,如下:

columns: STColumn[] = [
    { title: '编号', index: 'id' },
    { title: '邮箱', index: 'email' },
    { title: '电话', index: 'email',render:'custom'},
    {
      title: '操作',
      buttons: [
        {
          text: 'btn',
          type: 'link',
          click: (e: any) => console.log('btn click', e),
        },
      ],
    },
  ];

然后就是在html页面中添加ng-template,ng-template是Angular 结构型指令中的一种,用于定义模板渲染HTML(模板加载)。


    
        
          
          
          
        
    

ts中的render属性的值要与ng-template标签的st-row属性值对应,这样就会把相应ng-template中的html代码加载到对应了列中了。

 

你可能感兴趣的:(angular)