实现点击表格行变色

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. 【MySQL】04_约束

    约束 概述 为了保证数据的完整性,SQL规范以约束的方式对表数据进行额外的条件限制.从以下四个方面考虑: 实体完整性(Entity Integrity) :例如,同一个表中,不能存在两条完全相同无法区 ...

  2. python字符串的一些操作

    # 1.变量的多次赋值 print('1.变量的多次赋值') name = '小明' # 没有意义的 name = '小刚' # 对前面创建的变量名称进行覆盖 # 删除原来的数据,写入新的数据 pri ...

  3. Codeforces Round #811 (Div. 3)D. Color with Occurrences

    题目大意:给出一个文章t和n个字符串s1,s2...sn: 问能否用这n个字符串将整个文章覆盖: 思路:贪心(最小区间覆盖) 记录每个字符串能够覆盖的所有位置(起点,终点,编号) 排序后贪心的求出是否 ...

  4. 😊SpringBoot 整合 Elasticsearch (超详细).md

    SpringBoot 整合 Elasticsearch (超详细) 注意: 1.环境搭建 安装es Elasticsearch 6.4.3 下载链接 为了方便,环境使用Windows 配置 解压后配置 ...

  5. 云原生之旅 - 10)手把手教你安装 Jenkins on Kubernetes

    前言 谈到持续集成工具就离不开众所周知的Jenkins,本文带你了解如何在 Kubernetes 上安装 Jenkins,后续文章会带你深入了解如何使用k8s pod 作为 Jenkins的build ...

  6. (译)TDD(测试驱动开发)的5个步骤

    原文:5 steps of test-driven development https://developer.ibm.com/articles/5-steps-of-test-driven-deve ...

  7. 【题解】CF1715A Crossmarket

    题面传送门 解决思路 首先,我们让 Megan 先走,因为他可以留下传送门.可以得知,不管怎么走,他到达终点所耗费的能量一定是 \(n+m-2\) . 然后,Stanley 走时就可以利用传送门.考虑 ...

  8. 嵌入式-C语言基础:函数指针

    定义函数地址:如果在程序中定义了一个函数,那么在编译的时候,编译系统为函数代码分配一段存储空间,这段存储空间的起始地址(也叫入口地址)称为这个函数的地址. 和数组一样,数组名代表地址,而函数名表示函数 ...

  9. Bugku 字符?正则?

    打开是一段中规中矩的php代码 先读一下代码 高亮文件2.php 定义变量key 定义变量IM其值是一个正则表达式匹配的结果 如果IM是真就输出key 所以这道题的关键也就是IM正则匹配的结果了,我们 ...

  10. win 10 玩红警/黑边,不能全屏,闪退

    win 10玩红警黑边问题 1.下载ddraw.dll,放在游戏目录 下载链接:ddraw.dll 如果提示 选择保留就行了 2.Win 键+S键,搜索注册表,打开这个 进去按这个路径    计算机\ ...