如何将IgniteUI igGrid(Infragistics)与AngularJS集成并导出到Excel

时间:2017-09-24 14:40:39

标签: angularjs infragistics ignite-ui iggrid

我是AngularJS和IgniteUI的新手。到目前为止,我找不到任何好的例子来将Infragistics IgniteUI与AngularJS集成。我发现的样本不起作用。

根据示例,我整合了以下文件

<script src="~/Scripts/jquery-2.0.0.min.js"></script> 
<script src="~/Scripts/jquery-ui-1.12.0.js"></script>
<script src="~/Scripts/angular.min.js"></script>    

<script src="~/Scripts/Infragistics/js/infragistics.core.js"></script> 
<script src="~/Scripts/Infragistics/js/infragistics.lob.js"></script>    

<script src="~/Scripts/Infragistics/js/extensions/igniteui-angular.js"></script>

<script src="~/App/igniteUIApp.js"></script>

<div ng-app="igniteUIApp" ng-controller="SampleController">

    <ig-grid id="grid1" 
             data-source="employees" 
             primary-key="EmployeeID" 
             auto-generate-columns="true">
    </ig-grid>
</div>

我想看到以下内容

第1步  如何用$ scope.datasource填充igGrid?

第2步  如何将igGrid数据导出到Excel?

1 个答案:

答案 0 :(得分:1)

我准备了一个演示这个的小提琴 - http://jsfiddle.net/dkamburov/g34wy1mc/2/

将一些数据分配到范围属性中足以填充网格数据 - $scope.data = angular.copy(northwindProducts.results);

确保您拥有excel导出器所需的所有参考资料,然后您需要的只是$.ig.GridExcelExporter.exportGrid($("#grid1"));