給angularJs grid列上添加自定義按鈕

由於項目需要在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.方法名 ，不然方法無法調用，別問我咋知道的。。。

效果圖如下：