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. idea远程调试linux下的tomcat

    要远程调试代码,首先的保障本地的代码和远程tomcat的代码是同一份 首先在本地idea配置一个远程tomcat服务器 host就填写远程主机ip port填写访问的端口(不是调试端口) 然后在Sta ...

  2. JS —— 数组与字符串方法

    数组 1. 基本方法  1)Array.prototype.unshift(item1,item2,item3...) 描述: 在数组的前面添加元素,一次可以传入多个参数. 注意:元素会根据当前传入的 ...

  3. Java入门第二季第一章类和对象知识点

    Java 中的 static 使用之静态方法 1. 静态方法中可以直接调用同类中的静态成员,但不能直接调用非静态成员.如: 如果希望在静态方法中调用非静态变量,可以通过创建类的对象,然后通过对象来访问 ...

  4. AngularJS2之Angular正式初探

    前言:angular的官方教程真的不错.强烈推荐!!!] 按照环境搭建教程新建一个项目: 项目的结构如下: 其中package.json指示node需要安装的插件(npm install指令会安装的插 ...

  5. USACO 4.2 Drainage Ditches(网络流模板题)

    Drainage DitchesHal Burch Every time it rains on Farmer John's fields, a pond forms over Bessie's fa ...

  6. [HMLY]9.深入浅出-iOS Reactive Cocoa的常见用法

    简介 今天的主角是Reactive Cocoa,聊聊Reactive Cocoa的常见使用:KVO.Target.Delegate.Notification. Reactive Cocoa 是一个重量 ...

  7. Linux软件安装管理 - CentOS (三)

    1. 软件包管理简介 2. rpm命令管理(Redhat Package Manager) 3. yum在线安装 4. 源码包管理 4.1 源码包和RPM包的区别 4.1.1 区别 安装前:概念上的区 ...

  8. 数据挖掘_wget整站下载

    你应该了解的所有wget命令 翻译自All the Wget Commands You Should Know 如何下载整个网站用来离线浏览?怎样将一个网站上的所有MP3文件保存到本地的一个目录中?怎 ...

  9. js格式化时间为JSON格式 ajax提交 后台处理

    var effectRow = new Object();if ($('#grd_infos').datagrid('getChanges').length) {    var update = $( ...

  10. C# 给枚举定义DescriptionAttribute,把枚举转换为键值对

    在C#中,枚举用来定状态值很方便,例如我定义一个叫做Season的枚举 public enum Season { Spring = 1, Summer = 2, Autumn = 3, Winter ...