Comment intégrer IgniteUI igGrid (Infragistics) avec AngularJS et exporter vers Excel

Question

Je suis nouveau sur AngularJS et IgniteUI. Jusqu'à présent, je n'ai pas trouvé de bon exemple pour intégrer infragistics IgniteUI avec AngularJS. Les échantillons que j'ai trouvés ne fonctionnent pas.

Sur la base de l'échantillon que j'ai intégré les fichiers suivants

<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> 

Je voudrais voir ce qui suit

Étape 1 Comment remplir le igGrid avec scope.datasource de $?

Étape 2 Comment exporter les données igGrid vers Excel?

Answer 1

J'ai préparé un violon cette démonstration - http://jsfiddle.net/dkamburov/g34wy1mc/2/

Affectation des données dans la propriété de la portée est suffisante pour remplir les données de la grille - $scope.data = angular.copy(northwindProducts.results);

Assurez-vous d'avoir toutes les références nécessaires pour l'exportateur Excel et alors tout ce dont vous avez besoin est $.ig.GridExcelExporter.exportGrid($("#grid1"));