由于项目需要在angular 显示的表格中添加按钮,多次查询资料终于找到解决方法。就是给columnDefs 上的列增加 cellTemplate,同时绑定对应的触发事件,代码如下

  columnDefs: [

        enableFiltering : true,
     {name: 'id', displayName: '任务名称', width: '20%',cellFilter:'taskNameConvert'},
{name: 'busType',displayName : '任务类型',width : '20%',cellFilter : 'documentTypeConvert'},
{name : 'status',displayName : '进度',width : '20%',cellFilter : 'statusConvert'},
{name: 'createTime',displayName: '创建时间',width : '20%',cellFilter : 'date : "yyyy-MM-dd hh:mm:ss"'},
/*cellTemplate绑定点击事件必须设置为grid.appScope.方法名*/
{name : 'button',displayName : '功能',width : '18%',cellTemplate : '<div class="ui-grid-cell-contents"><a ng-href="" ng-if="row.entity.status == \'2\'" style="color: #0000cc;" ng-click="grid.appScope.download(row.entity);"下载</a></div>'}
  ],
$scope.download = function(obj){
window.location.href = 'http://xxxxxxx/' + obj.url;
};

我用到的是a标签,如果需要按钮则将 a 标签换成 button 标签即可。

注意:绑定的事件格式一定要为 grid.appScope.方法名 ,不然方法无法调用,别问我咋知道的。。。

效果图如下:

给angularJs grid列上添加自定义按钮的更多相关文章

  1. C#判断dataGridView1 点击的是哪一列上的按钮

    private void dataGridView1_CellContentClick(object sender, DataGridViewCellEventArgs e) { ) { DataGr ...

  2. 14、手把手教你Extjs5(十四)模块字段和Grid列的定义[2]

    model和columns生成好了,下面要修改一下Module.js和Grid.js中的代码,使其能够协同工作. /** * 一个模块的主控界面的容器,用来安放各个模块控件以及协调他们之间的关系 */ ...

  3. Dynamics 365 CRM 添加自定义按钮

    在添加自定义按钮之前,我们需要下载这个工具 RibbonWorkbench, 它是专门针对自定义命令栏和Ribbon区域. 下载之后是一个zip压缩包. 怎样安装RibbonWorkbench: Se ...

  4. AngularJS之WebAPi上传

    AngularJS之WebAPi上传(十)   前言 前面一系列我们纯粹是讲AngularJS,在讲一门知识时我们应该结合之前所学综合起来来做一个小的例子,前面我们讲了在MVC中上传文件的例子,在本节 ...

  5. Dynamics CRM2013 任务列表添加自定义按钮

    任务列表的command bar 上面添加自定义按钮如下 要注意的是此处的列表不是任务实体而是活动实体,如果你是在任务实体的home栏上面加那你永远看不见按钮的显示,但如果是要在任务的表单界面上加按钮 ...

  6. jqgrid 在表格底部添加自定义按钮

    往往我们需要在jqgrid底部的分页行中添加一些自定义按钮,效果如下: 上图中,三个按钮均是自定义添加上的. 1.要新增自定义按钮在表格底部,仍离不开分页div,需要给jqgrid绑定分页方法 2.由 ...

  7. ckeditor添加自定义按钮整合swfupload实现批量上传图片

    ckeditor添加自定义按钮整合swfupload实现批量上传图片给ckeditor添加自定义按钮,由于ckeditor只能上传一张图片,如果要上传多张图片就要结合ckfinder,而ckfinde ...

  8. WPF点击不同界面上的按钮实现界面切换

    原文:WPF点击不同界面上的按钮实现界面切换 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/qq_29844879/article/details/ ...

  9. VARCHAR列上的索引

    一年前,我写了在索引的导航结构里,SQL Server如何存储VARCHAR列.我们都知道,在SQL Server里索引(聚集索引,非聚集索引)的键列有最大900byte的大小限制. 假设现在你想捉弄 ...

随机推荐

  1. 蓝桥网试题 java 基础练习 杨辉三角形

    ----------------------------------------------------------- ---------------------------------------- ...

  2. <C++Primer>第四版 阅读笔记 第三部分 “类和数据抽象”

    类定义了数据成员和函数成员:数据成员用于存储与该类类型的对象相关联的状态:而函数成员则负责执行赋予数据意义的操作. 第12章 类 一个类可以包含若干公有的.私有的和受保护的部分:在public部分定义 ...

  3. Oracle_关联查询

    1. 等值连接(Equijoin).非等值连接(Non-Equijoin).外连接(Outer join):-->左外连接-->右外连接.自连接(Self join) 交叉连接(Cross ...

  4. angular1.5 Components

    如今前端界angular react vue三大框架并驾齐驱,其中有一个共同点就是组件化开发,这也符合w3c 推行Web Components的趋势.现如今不懂组件化开发的前端绝对不是好厨子.跳槽新公 ...

  5. ReentrantLock实现原理

    以下是本篇文章的大纲 1 synchronized和lock 1.1 synchronized的局限性 1.2 Lock简介 2 AQS 3 lock()与unlock()实现原理 3.1 基础知识 ...

  6. asp.net MVC4总结

    MVC4构建例子 新建MVC4项目 在项目工程下面的App_Data文件夹下面添加新建项->数据->  Sql server 数据库文件Movies.mdf 新建movies.cs模型类 ...

  7. Vue.js的环境搭建

    vue这个新的工具,确实能够提高效率,vue入门的精髓:(前提都是在网络连接上的情况下) 1.要使用vue来开发前端框架,首先要有环境,这个环境要借助于node,所以要先安装node,借助于node里 ...

  8. JVM内存

    大多数 JVM 将内存区域划分为 Method Area(Non-Heap)(方法区) ,Heap(堆) , Program Counter Register(程序计数器) ,   VM Stack( ...

  9. java 四则混合运算 计算器

    public class Counter { /**用递归算法,把括号内的公式算出然后递归   * @param args   */ public static void calculator (St ...

  10. 读书笔记 effective c++ Item 23 宁可使用非成员非友元函数函数也不使用成员函数

    1. 非成员非友元好还是成员函数好? 想象一个表示web浏览器的类.这样一个类提供了清除下载缓存,清除URL访问历史,从系统中移除所有cookies等接口: class WebBrowser { pu ...