How to add custom action button - --ng2-smart-table

you can try this. change your setting to:

settings = {
hideSubHeader: true,
actions: {
  custom: [
    {
      name: 'yourAction',
      title: '<i class="ion-document" title="YourAction"></i>'
    },
    {
      name: 'editAction',
      title: '<i class="ion-edit" title="Edit"></i>'
    },
    {
      name: 'deleteAction',
      title: '<i class="far fa-trash-alt" title="delete"></i>'
    }
  ],
  add: false,
  edit: false,
  delete: false
}
...
};

then add this into your component.scss

    :host /deep/ ng2-st-tbody-edit-delete {display: flex !important;
  height: 0 !important;
}

:host /deep/ ng2-st-tbody-custom a.ng2-smart-action.ng2-smart-action-custom-custom {
  display: inline-block;
  width: 50px;
  text-align: center;
  font-size: 1.1em;
}

:host /deep/ ng2-st-tbody-custom a.ng2-smart-action.ng2-smart-action-custom-custom:hover {
  color: #5dcfe3;
}
posted @   Lamb_quan  阅读(842)  评论(0编辑  收藏  举报
编辑推荐:
· 用 C# 插值字符串处理器写一个 sscanf
· Java 中堆内存和栈内存上的数据分布和特点
· 开发中对象命名的一点思考
· .NET Core内存结构体系(Windows环境)底层原理浅谈
· C# 深度学习:对抗生成网络(GAN)训练头像生成模型
阅读排行:
· 手把手教你更优雅的享受 DeepSeek
· AI工具推荐:领先的开源 AI 代码助手——Continue
· 探秘Transformer系列之(2)---总体架构
· V-Control:一个基于 .NET MAUI 的开箱即用的UI组件库
· 乌龟冬眠箱湿度监控系统和AI辅助建议功能的实现
点击右上角即可分享
微信分享提示