我通过ajax调用从javascript加载datatable。这是我的数据表的一部分：
"columns": [
{ "data": "carType" },
{ "data": "id" },
{ "data": "carChassis" },
{ "data": "initialKm" },
{ "data": "note" },
{data:null, render: function ( data, type, row ) {
return '<a data-ng-click="downloadFile('+row.idCar+')"> <i class="fa fa-file-excel-o fa-2x" style="color:green;" aria-hidden="true"></i></a>'
}
},
{data:null, render: function ( data, type, row ) {
return '<a data-ng-click="downloadFile('+row.idCar+')"> <i class="fa fa-file-text-o fa-2x" aria-hidden="true"></i></a>'
}
},
{data:null, render: function ( data, type, row ) {
return '<button type="button" class="btn btn-danger" id="deleteCar" data-toggle="modal"'
+'data-target="#deleteCarModal">Delete</button>'
}
}
],
但它没有调用我的downloadFile函数：
//Download file
$scope.downloadFile = function(idCar) {
$.fileDownload("../cars/download/" + idcar , {
successCallback: function (url) {
},
failCallback: function (HttpServletResponse, url) {
notifyMessage("Error downloading file", 'error');
}
});
return false; //this is critical to stop the click event which will trigger a normal file download!
}
如果我将href=""添加到a标记，则可以重新加载数据表。你有过这个问题吗？
这是HTML页面：
body class="hold-transition skin-blue sidebar-mini" data-ng-app="myApp">
<input type="hidden" id="role"
th:value="${#authentication.getAuthorities()}">
<div class="wrapper" data-ng-controller="carController">
<!-- Header nd menu fragment -->
<div th:replace="../fragments/dashboard-header :: dashboard-header"></div>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>Cars Management</h1>
<ol class="breadcrumb">
<li><a th:href="@{/}"><i class="fa fa-dashboard"></i> Home</a></li>
<li><a th:href="@{/fleetAndCar/}">><i class="fa fa-car"></i>Fleets
management
</a></li>
<li class="active"><i class="fa fa-car"></i>Cars management</li>
</ol>
</section>
<!-- Main content -->
<section class="content">
<div class="row">
<div class="col-xs-12">
<div class="box">
<div class="box-header">
<h3 class="box-title">Cars</h3>
</div>
<!-- /.box-header -->
<div class="box-body">
<!-- Fleets table -->
<table id="carsTable" class="table table-bordered table-striped">
<thead>
<tr>
<th>Car type</th>
<th>Id</th>
<th>Car chassis</th>
<th>Initial Km</th>
<th>Note</th>
<th>Datatable</th>
<th>Acquisition log</th>
<th>Delete</th>
</tr>
</thead>
</table>
<!-- Create two equals button because when I am on desktop I show the text add fleet otherwise the + and the tooltip.
This is need because otherwise the text goes out the button -->
<button id="addCarButton" type="button"
class="btn btn-primary visible-lg col-lg-1 col-lg-offset-11"
data-toggle="modal" data-target="#addCarModal">Add car</button>
<button id="addCarButton" type="button"
class="btn btn-primary hidden-lg col-xs-1 col-xs-offset-11"
data-toggle="modal" data-target="#addCarModal">
<span class="glyphicon glyphicon-plus" data-toggle="tooltip"
title="Add car"></span>
</button>
</div>
<input type="hidden" id="hiddenIdFleet" th:value="${idFleet}"></input>
</div>
</div>
<!-- /.col -->
</div>
<!-- /.row -->
</section>
<!-- /.content -->
</div>
<!-- Modal to add car -->
<div class="modal" id="addCarModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Car parameters</h4>
</div>
<div class="modal-body">
<!-- form start -->
<form novalidate class="simple-form" name="newCarForm">
<div class="box-body">
<div class="form-group">
<div class="form-group">
<label>Fleet application</label>
<!-- Show fleet application -->
<input class="form-control" type="text"
value="{{fleetApplication}}" readonly="readonly" /> <input
type="hidden" data-ng-model="newCar.fleet">
</div>
</div>
<div class="form-group">
<div class="radio">
<label> <input type="radio" name="optionsRadios"
ng-click="existingCar()" checked> Use existing car
type
</label>
</div>
<div class="radio">
<label> <input type="radio" name="optionsRadios"
data-ng-click="newCarType()"> Create new car type
</label>
</div>
</div>
<div class="form-group" id=existingCarType>
<label>CarType</label>
<ui-select data-ng-init="updateCarType()" id="selectCarType"
theme="bootstrap" style="width: 100%;"
data-ng-model="newCar.carType" required> <ui-select-match
placeholder="Select car type">
{{$select.selected.idCarType}}</ui-select-match> <ui-select-choices
repeat="carType.idCarType as carType in (carTypeList | filter: $select.search) track by carType.idCarType">
<span data-ng-bind="carType.idCarType"></span> </ui-select-choices> </ui-select>
</div>
<div class="form-group" id=newCarType style="display: none;">
<label>CarType</label> <input id="carTypeText"
data-ng-model="newCar.carType" type="text"
class="form-control" placeholder="New car Type" disabled
required>
</div>
<div class="form-group">
<label>Id</label> <input data-ng-model="newCar.id"
id="identifier" type="text" class="form-control"
placeholder="Identifier" required>
</div>
<div class="form-group">
<label>km</label><span id="errmsg"
style="float: right; color: red"></span> <input
data-ng-model="newCar.initialKm" id="initialKm" type="number"
class="form-control" placeholder="Initial Km" min="0" required>
</div>
<div class="form-group">
<label>Car chassis</label> <input
data-ng-model="newCar.carChassis" id="carChassis" type="text"
class="form-control" placeholder="Car chassis" required>
</div>
<div class="form-group">
<label>Note </label>(optional)
<textarea data-ng-model="newCar.note" class="form-control"
rows="2" maxlength="100"></textarea>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left"
data-dismiss="modal">Close</button>
<button data-ng-disabled="newCarForm.$invalid"
data-ng-click="createCar(newCar)" type="button"
class="btn btn-primary">Create car</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
<!-- Modal delete car -->
<div class="modal" id="deleteCarModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"
aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<h4 class="modal-title">Delete car</h4>
</div>
<div class="modal-body">
<div class="box-body">Are you sure? The car will be deleted
permanently, you won't be able to recover it.</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left"
data-dismiss="modal">Cancel</button>
<button class="btn btn-danger btn-ok" data-ng-click="deleteCar()"
id="deleteCarButton">Delete</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
</div>
</body>
</html>