使用angular.js单击按钮后无法获取表值

Question

我有一个问题。使用Angular.js单击按钮后，我无法在控制台中获取表值。我正在解释下面的代码。

 <span class="input-group-btn">
    <button class="btn btn-default" type="button" ng-click="exportData();">Export</button>
    </span>
<div class="table-responsive dashboard-demo-table"  id="exportable" style="display:none;">
    <table class="table table-bordered table-striped table-hover">

       <thead>
       <tr>
        <th>Date</th>
        <th>Product Name</th>
        <th>Discount</th>
        <th>Offer</th>
        <th>Unit Cost Price</th>
        <th>Unit Sale Price</th>
        <th>Quantity</th>
        <th>Shipping Charge</th>
        <th>Specification</th>
        <th>Display Sale price</th>
       </tr>
       </thead>

       <tbody>
       <tr   ng-repeat="rep in listOfReportData ">
        ----------------------------
       --------------------------------
       </tr>
       </tbody>

   </table>
</div>

当用户点击Export按钮时，表格中会显示一些数据数组（$scope.listOfReportData）。点击下面的控制器代码。

 $scope.exportData=function(){
    $http({
            method:'POST',
            url:"php/getProductReportData.php",
            data:proData,
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
        }).then(function successCallback(response){
              $scope.listOfReportData=response.data;
                     console.log('export',document.getElementById('exportable').innerHTML);
        },function errorCallback(response) {
})
}

这里我试图在数据可用之后检查控制台中的总表但是不可能发生这样的事情。我需要在表中有完整的数据后检查控制台中的表。请帮助我。