angularjs - 从 AngularJS 中的智能表导出数据

Question

在 AngularJS 项目中，我使用智能表模块和 asafdav/ng-csv 将数据从智能表导出到 CSV。

我成功地将数据从智能表导出到 csv，但仅限于第一页。我从变量中导出数据$scope.displayedCollection（与 st-table 指令相同）。此变量中的数据与表中的数据完全相同，但仅来自第一页。你知道我怎样才能导出整个数据（从智能表中排序和过滤）。我认为在将数据拆分为页面之前，我应该“插入”到智能表模块。但是怎么做？

Answer 1

我创建了自己的指令，用于在分页之前从表中访问数据：

angular.module('smart-table')
.directive('stFilteredCollection', function () {
    return {
      restrict: 'A',
      require: '^stTable',
      scope: {
        stFilteredCollection: '='
      },
      controller: 'stTableController',
      link: function (scope, element, attr, ctrl) {

        scope.$watch(function () {
          return ctrl.getFilteredCollection();
        }, function (newValue, oldValue) {
          scope.stFilteredCollection = ctrl.getFilteredCollection();
        });
      }
    };
  });

要使用它，请添加st-filtered-collection带有变量名称的属性，该变量将在分页前设置为表中的数据：

<table st-table="..." st-safe-src="..." st-filtered-collection="filteredCollection">
   ...
</table>

从现在开始，您可以在控制器中使用$scope.filteredCollection变量。

Answer 2

添加ng-csv.min.js到您的主文件 ( index.html)。还请确保您正在添加angular-sanitize.min.js.

HTML：

<td><a class="btn btn-default" st-expor  ng-csv="displayed" filename="test.csv" csv-header="['Field A', 'Field B', 'Field C']">ExportNow</a></td>

控制器：

top line
var myApp = angular.module('myApp', ['smart-table', 'ui.bootstrap','ngSanitize', 'ngCsv']);

somewhere in your controller

.directive('stExport', function(csv){
        return {
          restrict:'E',
          require:'^stTable',
          template:'<button ng-click="export()"></button>',
          link:function(scope, element, smartTable){
              scope.export = function(){
                  var filtered = smartTable.getFilteredCollection();
                  csv(filtered); 
              }
          }
        }
     })