码迷,mamicode.com
首页 > 其他好文 > 详细

ng-alain组件st表格,实现点击表格行变色,或者渲染变色

时间:2020-04-25 00:45:02      阅读:236      评论:0      收藏:0      [点我收藏+]

标签:his   sina   number   art   std   style   条件   mod   sele   

实现点击表格行变色

html文件

<st #st  [data]="data" (change)="changeClick($event)" [columns]="columns" [page]="page"
                [widthMode]="STWidthMode" [scroll]="{ x: ‘350px‘, y: ‘400px‘ }">
              </st>

ts文件函数

 // 點擊表格行改變事件1
  changeClick(e: STChange) {
    if(this.lastItem){
      this.lastItem[‘_rowClassName‘] = ‘‘;
    }
    this.setSelectEdit(true);
    // console.log(e)
    e.click.item[‘_rowClassName‘] = ‘sign-tr‘;
    this.lastItem = e.click.item;
  }
  // 點擊表格行改變事件2

less文件

::ng-deep{
  .sign-tr{
      background-color: #93cafe !important; 
  }
}

恕我直言,这玩意感觉有点慢

也很少有这种需求吧?????

渲染变色;

下面的内容参考来自:https://blog.csdn.net/sinat_41806435/article/details/101534744

html中,增加 rowClassName属性

<st #st [rowClassName]="rowClassName" [data]="url" [columns]="columns" [page]="page"></st>

根据某条件,返回类名

rowClassName(record: STData, index: number) {
  if(record.leftDay < 0) {
    return ‘sign-tr‘;
  }
}

 css中

::ng-deep{
    .sign-tr{
        background-color: #fabeb9 !important; 
    }
}

 

ng-alain组件st表格,实现点击表格行变色,或者渲染变色

标签:his   sina   number   art   std   style   条件   mod   sele   

原文地址:https://www.cnblogs.com/sugartang/p/12766496.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!