angularjs uigrid 中celltemplate的写浮动框
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的写浮动框的更多相关文章
- ui-grid 中cellTemplate中click事件
cellTemplate中使用的函数: 外部定义的函数:
- webdriver高级应用- 在ajax方式产生的浮动框中,单击选择包含某个关键字的选项
Ajax简介: Ajax:局部刷新,原理上也是一个js,js调用服务器的远程接口刷新局部页面数据. Ajax = 异步 JavaScript 和 XML(标准通用标记语言的子集). Ajax 是一种用 ...
- hover时显示可跟随鼠标移动的浮动框,运用函数节流与去抖进行优化
在很多笔试面试题中总能看到js函数去抖和函数节流,看过很多关于这两者的讨论,最近终于在一个需求中使用了函数去抖(debounce)和函数节流(throttle). 需要完成的效果是,鼠标在表格的单元格 ...
- 非常强大的jQuery万能浮动框插件
支持hover, click, focus以及无事件触发:支持多达12种位置的定位,出界自动调整:支持页面元素加载,Ajax加载,下拉列表,提示层效果,tip类效果等:可自定义装载容器:内置UI不错的 ...
- 关于css浮动框是否脱离文档流的分析
在了解浮动属性之前,首先我们先了解一下html中关于display属性的相关知识. display属性常用的有inline, block, inline-block. inline也就是内联的意思. ...
- bootstrap中popover.js(弹出框)使用总结+案例
bootstrap中popover.js(弹出框)使用总结+案例 *转载请注明出处: 作者:willingtolove: http://www.cnblogs.com/willingtolove/p/ ...
- selenium处理Ajax浮动框方法
package com.allin.pc;import java.util.List;import org.openqa.selenium.WebElement;import org.openqa.s ...
- 在AngularJS应用中实现认证授权
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAokAAAFwCAIAAABbwHY6AAAgAElEQVR4nOy9+XtcxbX3+/4H9z73jP ...
- div 浮动框
随机推荐
- centos设置服务开机自启动
在CentOS或者RedHat其他系统下,如果是后面安装的服务,如httpd.mysqld.postfix等,安装后系统默认不会自动启动的.就算手动执行/etc/init.d/mysqld start ...
- 计算字符串中每种字符出现的次数[Dictionary<char,int>泛型集合用法]
有一道经典的面试题: 统计 welcome to china中每个字符出现的次数,不考虑大小写. 第一个出现在脑海里的想法是: 1. 将字字符串转换成 char数组: 2. 用 for循环遍 ...
- Curator Recipes(Cache&Counter)
Cache 路径缓存(Path Cache) 监视一个ZNode,当子节点增加.更新.删除改变状态时,路径缓存会在本地保存当前子节点及其数据和状态. public PathChildrenCache( ...
- Flexible 弹性盒子模型之CSS align-items 属性
实例 居中对齐弹性盒的各项 <div> 元素: div { display: flex; align-items:center; } 复制 效果预览 浏览器支持 表格中的数字表示支持该属性 ...
- iOS开发-OC语言 (四)数组
知识点 1.NSArray 2.NSMutableArray 1.数组的基本用法: 2.数组的遍历 3.数组排序 =========== NSArray 不可变数组 ============= ...
- 国内下载比较快的Maven仓库镜像
#收集的比较快的maven仓库 http://maven.wso2.org/nexus/content/groups/public/ http://jcenter.bintray.com/http:/ ...
- 如何使用jQuery动态的在body里添加script标签?
var script = document.createElement('script'); script.type = 'text/jacascript'; script.src = 'url'; ...
- ubuntu安装jdk的两种方法
方法一: 这种方法比较简单,保证虚拟机网络畅通就可以了 sudo apt-get update sudo apt-get install default-jre sudo apt-get instal ...
- openui5中的RESTful实现odata协议
这篇文章第一次看到就一见如故,它是对过去一个时代分布式计算模型的总结,<分布式计算编程模型之RPC>:http://www.infoq.com/cn/news/2016/04/Distri ...
- WebTours服务的启动
简介: HP loadrunner自带的一个飞机系统订票网站. 启动服务的步骤: 1.启动StartServer.bat 所在的路径: (\HP LoadRunner 12.02 Community ...