Reputation: 69
//Use angularjs render data
app.controller('ArticleListController', ['$scope', '$http', function ($scope, $http) {
$scope.options = {
sAjaxSource: 'api/datatable.json',
"aoColumnDefs": [
{ mData: 'engine', "aTargets": [0] },
{ mData: 'browser', "aTargets": [1] },
{ mData: 'platform', "aTargets": [2] },
{ mData: 'version', "aTargets": [3] },
{
mData: 'grade', "aTargets": [4],
//Here ! It can't do work
"mRender": function (data, type, full) {
return '<a class="glyphicon glyphicon-pencil" href="/Country/Edit/' + data + '">Edit</a><a class="glyphicon glyphicon-remove" href="/Country/Delete/' + data + '">Delete</a>';
}
},
]
}
}]);
//this is html
<div class="bg-light lter b-b wrapper-md">
<h1 class="m-n font-thin h3">Datatable</h1>
</div>
<div class="wrapper-md">
<div class="panel panel-default">
<div class="panel-heading">
DataTables
</div>
<div class="table-responsive">
<table ui-jq="dataTable" ui-options="{{options}}" class="table table-striped b-t b-b">
<thead>
<tr>
<th style="width:20%">Rendering engine</th>
<th style="width:25%">Browser</th>
<th style="width:25%">Platform(s)</th>
<th style="width:15%">Engine version</th>
<th style="width:15%">CSS grade</th>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</div>
</div>
I want to custome a columns style ,for example I want show a link in a cell,but my mRender function can't work ,please help me ! Thanks. .................. ..........................................................................................................................................................................................................................................
Upvotes: 1
Views: 231
Reputation: 69
All right, I got resolve the question.
angular.controller('myController', function($scope) {
$scope.options = {
data: dset,
aoColumns: [
{ mData: 'title' },
{ mData: 'firstName' },
{ mData: 'lastName' },
{ mData: 'email' }
],
"aoColumnDefs": [ {
"aTargets": [ 3 ],
"mRender": function ( data, type, full ) {
return '<a href="/mailto/' + full[3] + '">' + data + '</a>';
}
}
]
};
});
//Here ! the ui-options='options'
<table ui-jq="dataTable" ui-options="options" class="table table-striped m-b-none">
So, my code ui-options="{{options}}" and the right code shoud be ui-options='options'
Upvotes: 1