2017-04-12 106 views
1

DTColumnBuilder.newColumn.renderWidth有沒有包含自定義指令的方法?這是我想達到的草案的代碼。在DTColumnBuilder上包含自定義指令renderwidth

DTColumnBuilder.newColumn('reportStructureName').withTitle('Structure Name') 
    .renderWith((data, type, full) => { 
      return "<my-directive></my-directive>"; 
    }), 

回答

1

可以$compilecreatedCell回調單元格內容。這是一個非常簡單的例子,其中一個指令除了將文本上色爲紅色之外什麼也不做。對不起,不使用箭頭功能:)

$scope.data = [ 
    { reportStructureName : "structurename1" }, 
    { reportStructureName : "structurename2" }, 
    { reportStructureName : "structurename3" }, 
    { reportStructureName : "structurename4" } 
] 

$scope.dtOptions = DTOptionsBuilder.newOptions() 
    .withOption('data', $scope.data) 
    .withPaginationType('full_numbers'); 

$scope.dtColumns = [  
    DTColumnBuilder.newColumn('reportStructureName') 
    .withTitle('Structure Name') 
    .renderWith(function(data, type, full) { 
     return "<my-directive>"+data+"</my-directive>"; 
    })  
    .withOption('createdCell', function(td, cellData, rowData, row, col) { 
     $compile(td)($scope); //<--- here 
    }) 
]  

指令:

.directive('myDirective', function() { 
    return { 
    restrict: 'AE', 
    link: function (scope, element, attr, ctrl) { 
     angular.element(element).css('color', 'red') 
    } 
    } 
}) 

演示 - >http://plnkr.co/edit/aok6SyWZlLaQv8UsEVIf?p=preview

+0

感謝這個,我在外面試試這個,並會更新你的。 :) – jengfad