columnDefs: [
{field: 'collegename', enableFiltering: false ,width:"12%",displayName:"学院" },
{field: 'effect',enableFiltering: false ,cellTemplate:'<td ng-repeat="t in row.entity.effect" ><span class="btn btn-primary btn-xs" title="详情">{{t.course}}</span><div class="relative"><div class="popover" ng-style="{display: t.popover?\'block\':\'none\'}"><div class="popover-content">学科名称:{{t.course}}<br>学科类别:{{t.coursetype}}<br>学年学期:{{t.time}} </div></div></div></td>',
displayName:"预测关联挂科学科名称,专业类别和学年学期",
cellClass:'out'/*,cellClass:"blue"*/},
{field: 'cause', enableFiltering: false ,cellTemplate:'<table class="table"><tr ng-repeat="t in row.entity.cause"><td>{{t.course}}</td><td>{{t.coursetype}}</td><td>{{t.time}}</td></tr></table>',displayName:"挂科学科名称,专业类别和学年学期"/*,cellClass:"red"*/},
{field: 'support', enableFiltering: false,width:"8%",cellTemplate:'<label class="control-label">{{(row.entity.support*100).toFixed(2)}}%</label>',displayName:"挂科学科占比"},
{field: 'zconf',width:"8%", enableFiltering: false,cellTemplate:'<label class="">{{(row.entity.zconf*100).toFixed(2)}}%</label>',displayName:"挂科关联度", }
],

  第二列的的样式就是,当鼠标停留在标签上时,就会触发ng-mouseenter事件,显示出具体信息,这里比较重要的就是在celltemplate中单引号和双引号的使用,以及ng-style的样式

ng-style="{display: t.popover?\'block\':\'none\'}"。

具体的angularjs uigrid API以及demo在网址http://ui-grid.info/,以及angularjs的一些简单应用,网址http://showcase.ngnice.com/#/table/local

angularjs uigrid 中celltemplate的写浮动框的更多相关文章

  1. ui-grid 中cellTemplate中click事件

    cellTemplate中使用的函数: 外部定义的函数:

  2. webdriver高级应用- 在ajax方式产生的浮动框中,单击选择包含某个关键字的选项

    Ajax简介: Ajax:局部刷新,原理上也是一个js,js调用服务器的远程接口刷新局部页面数据. Ajax = 异步 JavaScript 和 XML(标准通用标记语言的子集). Ajax 是一种用 ...

  3. hover时显示可跟随鼠标移动的浮动框,运用函数节流与去抖进行优化

    在很多笔试面试题中总能看到js函数去抖和函数节流,看过很多关于这两者的讨论,最近终于在一个需求中使用了函数去抖(debounce)和函数节流(throttle). 需要完成的效果是,鼠标在表格的单元格 ...

  4. 非常强大的jQuery万能浮动框插件

    支持hover, click, focus以及无事件触发:支持多达12种位置的定位,出界自动调整:支持页面元素加载,Ajax加载,下拉列表,提示层效果,tip类效果等:可自定义装载容器:内置UI不错的 ...

  5. 关于css浮动框是否脱离文档流的分析

    在了解浮动属性之前,首先我们先了解一下html中关于display属性的相关知识. display属性常用的有inline, block, inline-block. inline也就是内联的意思. ...

  6. bootstrap中popover.js(弹出框)使用总结+案例

    bootstrap中popover.js(弹出框)使用总结+案例 *转载请注明出处: 作者:willingtolove: http://www.cnblogs.com/willingtolove/p/ ...

  7. selenium处理Ajax浮动框方法

    package com.allin.pc;import java.util.List;import org.openqa.selenium.WebElement;import org.openqa.s ...

  8. 在AngularJS应用中实现认证授权

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAokAAAFwCAIAAABbwHY6AAAgAElEQVR4nOy9+XtcxbX3+/4H9z73jP ...

  9. div 浮动框

随机推荐

  1. 说说Request.Params[key]和Request[key]

    摘要 其实你一看到,就应该会想到,这个不简单吗,不就是服务端接收参数的一种方式吗?是的.在asp.net编程中,QueryString.Form.Cookie是三种比较常见的接收客户端参数的方式.Qu ...

  2. OC之方法的声明实现和调用

    1. 类是来描述一群具有相同特征和行为的事物的. 类还有行为. 类的声明 @interface 类名 : NSObject { 属性. } 方法的声明 @end 类的实现. @implementati ...

  3. Python print报ascii编码异常的靠谱解决办法

    之前遇到此异常UnicodeEncodeError: 'ascii' codec can't encode characters...,都是用这种方式解决:sys.setdefaultencoding ...

  4. CSS之纯CSS画的基本图形(矩形、圆形、三角形、多边形、爱心、八卦等)

    图形包括基本的矩形.圆形.椭圆.三角形.多边形,也包括稍微复杂一点的爱心.钻石.阴阳八卦等.当然有一些需要用到CSS3的属性,所以在你打开这篇文章的时候,我希望你用的是firefox或者chrome, ...

  5. OpenVPN客户端证书合并到配置文件中

    这里只讲OpenVPN客户端证书合并到配置文件中,避免文件太多,管理不便! 生成的客户端证书和配置文件,客户端需要的一共有5个文件:ca.crt.client.crt.client.key.ta.ke ...

  6. LR日志解析

    在录制和回放的时候,VU会分别把发生的事件记录成日志文件,这些日志有利于我们跟踪VU和服务器的交互过程. 1.回放日志(Replay log) 脚本回放运行时的输出都记在这个log里. "输 ...

  7. python爬虫框架scrapy初试(二)

    将该导航网站搜索出结果的页面http://www.dmoz.org/Computers/Programming/Languages/Python/Books/里面标题,及标题的超链接和描述爬下来. 使 ...

  8. JavaScript HTML DOM 元素(节点)

    添加和删除节点(HTML 元素) 创建新的 HTML 元素  如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素追加该元素. 例如:这段代码创建新的 < ...

  9. IPython与notebook 安装

    基于 python2.7.13 32-bit版本安装 1.安装pyreadline https://pypi.python.org/pypi/pyreadline 下载对应的32位版本 2.用pip安 ...

  10. CodeForces 707C Pythagorean Triples

    数学,构造. 这题比较有意思,一开始没发现结论写了一个最坏复杂度为$O({10^9})$暴力居然能$AC$,正因为如此,我才发现了规律. 一开始是这么想的: 先假设$n$为直角边,设斜边长度为$c$, ...