实现点击表格行变色

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表格,实现点击表格行变色,或者渲染变色的更多相关文章

  1. easyui的datagrid组件,如何设置点击某行不会高亮该行的方式

    easyui的datagrid组件,有些时候我们点击某行不想高亮显示,如何设置点击某行不会高亮该行的方式,有好几种方法可以实现,我举几个,可以根据你具体需求灵活应用: 1.修改easyui的css将高 ...

  2. [转]jquery 点击表格变为input可以修改无刷新更新数据

    原文地址:http://www.freejs.net/article_biaodan_43.html 之前已经发了2篇类似的文章<点击变td为input更新>和<jquery表格可编 ...

  3. table表格实现点击修改 PHP同步数据库 排序

    最近几天在做一个网站,牵扯到一个导航管理的功能!领导说不用作,可是由于自己自作主张,搞了1天的功能.领导说这个导航管理就是不用做!容易牵扯出好多问题来!估摸是客户小的原因! 没办法就把我1天的劳动荒废 ...

  4. 点击表格的单元格时实现变颜色,通过for循环为每个单元格添加一个onclick事件

    <title>无标题文档</title> <script type="text/javascript" language="javascri ...

  5. element ui table(表格)点击一行展开

    element ui是一个非常不错的vue的UI框架,element对table进行了封装,简化了vue对表格的渲染. element ui表格中有一个功能是展开行,在2.0版本官网例子中,只可以点击 ...

  6. elementUI表格行的点击事件,点击表格,拿到当前行的数据

    1.绑定事件 2.定义事件 3.点击表格某行的时候,拿到数据]

  7. 在页面上绘制一张表格,使用 DOM 节点的动态添加和删除向表格中插入数据,点击表格每行后的“删除”超链接

    查看本章节 查看作业目录 需求说明: 在页面上绘制一张表格,使用 DOM 节点的动态添加和删除向表格中插入数据,点击表格每行后的"删除"超链接,使用 DOM 节点的删除操作将对应的 ...

  8. 如何将WORD表格转换成EXCEL表格

    WORD和EXCEL都可以制作表格,但WORD表格与EXCEL表格之间有着很明显的差距,所以在办公中经常会需要将WORD转换成EXCEL,今天小编就教大家一招将WORD表格转换成EXCEL表格. 操作 ...

  9. 【JAVA】JSP+layui框架 静态表格转化成数据表格

    <table lay-filter="demo" class="layui-table" id="excTable"> < ...

  10. Jquery操作表格多出一个内容行

    目录 前言 需求 如何监听每一行点击,获取点击id 前后端 问题更新,ajax异步带来的问题 废弃使用HTML拼接 前言 我的前端实在是太差劲了,导致Jquery操作表格多出一个内容行,这个功能我都做 ...

随机推荐

  1. React动画实现方案之 Framer Motion,让你的页面“自己”动起来

    前言 相信很多前端同学都或多或少和动画打过交道.有的时候是产品想要的过度效果:有的时候是UI想要的酷炫动画.但是有没有人考虑过,是不是我们的页面上面的每一次变化,都可以像是自然而然的变化:是不是每一次 ...

  2. rocky8删除/etc/fstab 和/boot/所有文件,通过光盘救援模式恢复

    rocky8删除/etc/fstab 和/boot/所有文件,通过光盘救援模式恢复 mkdir /rootdir 先通过df和lsblk确定那个分区是根,如果确定不了,就先挂载一个分区,查看里边的文件 ...

  3. Transformer 结构分析

    self-attetion 1. 输入 \[X = EmbeddingLookup(X) + PositionalEncoding \\ X.shape == (batch\_size, seq\_l ...

  4. Codeforces 1670 E. Hemose on the Tree

    题意 给你个数p,n = 2^p: 有一棵树有n个节点,告诉你怎么连边: 每个点有个权值,每条边也有个权值,权值需要自行分配,[1,2,3..n...2n-1],总共2n-1个权值: 你需要选一个节点 ...

  5. 如何判断多个url的状态 即是否能成功访问?

    假设我们所有的url在excel种我们可以用loadwork 这个库 遍历所有的url 放入 列表 再通过request 或者 httpx 来判断 这个网址status_code 进而放入mongo种 ...

  6. React 函数组件

    React 函数组件 1.定义方式 React 函数组件是指使用函数方法定义的组件. 定义方式:与函数的定义方式相同,需要将内容 return 出来,需要注意的是最外层只有一个标签或者使用<&g ...

  7. Qt--无边框窗口完美(FrameLess)实现,包含缩放和移动功能重写。

    前言 Qt原本的窗口虽然可以通过QSS样式进行美化,但是只是对客户区有用,对于客户区是无效的.所以想做出一个比较好看的程序,还得自己重写实现无边框窗口. Qt实现无边框其实一句代码就可以,但是窗口自带 ...

  8. 解决pip下载速度慢问题

    解决pip下载速度慢的问题 痛点:当我们pip 安装第三方库的时候,由于是访问的国外地址,所以会出现下载很慢!干等..... 解决方案: # 1.在C盘目录-->Users-->用户--& ...

  9. Archlinux + Dwm 配置流程

    本着学习C的态度来了解dwm,本身作为一个i3wm的追崇者,与dwm会擦出怎么样的火花呢? 下载安装dwm archlinuxcn源配置 编辑/etc/pacman.conf文件,添加bfsu的arc ...

  10. 关于pip3 ImportError: cannot import name 'main'的报错的原因及解决办法

    这个问题的出现大多数都是因为你用错误的方法去升级pip3导致的 先来说一下正确的升级方法: python3 -m pip install --upgrade pip 我发现升级后版本变为了 19.x, ...