角度2のピボットテーブルコンポーネント？

Question

私はいくつかの豊富なピボットテーブル機能を持​​つUIコンポーネントを探しています。

私はag-gridを見ました。適切であると思われますが、それは無料ではなく、現時点では選択肢ではありません。将来的には可能かもしれませんが、今は自由でなければなりません。

角度2のオプションがない場合は、バニラのjavascriptコンポーネントを使用することをお勧めしますか？

<h1 class="push-down-md">igPivotGrid using XmlDataSource</h1> 

<div class="row"> 
    <div class="col-md-12"> 
     <ig-pivot-grid [(widgetId)]="gridId" [(options)]="optsGrid"> 
     </ig-pivot-grid> 
     <ig-pivot-data-selector [(widgetId)]="selectorId" [(options)]="optsSelector"> 
     </ig-pivot-data-selector> 
    </div> 
</div> 

これかもしれスイートあなたの条件：

Answer 1

は

import {Component, Inject, ElementRef, EventEmitter, HostListener} from '@angular/core'; 
import {IgPivotDataSelectorComponent, IgPivotGridComponent} from "./src/igniteui.angular2.ts"; 
import {bootstrap } from '@angular/platform-browser-dynamic' 

declare var jQuery: any; 
@Component({ 
    selector: 'my-app', 
    templateUrl: "./igPivotGrid-XmlaDataSourceTemplate.html", 
    directives: [IgPivotDataSelectorComponent, IgPivotGridComponent] 
}) 
export class AppComponent { 
    private optsGrid: IgPivotGrid; 
    private optsSelector: IgPivotDataSelector; 
    private selectorId: string; 
    private gridId: string; 
    private data: any; 

    constructor() { 
     this.data = new jQuery.ig.OlapXmlaDataSource({ 
      serverUrl: 'http://sampledata.infragistics.com/olap/msmdpump.dll', 
      catalog: 'Adventure Works DW Standard Edition', 
      cube: 'Adventure Works', 
      rows: "[Ship Date].[Calendar]", 
      columns: "[Delivery Date].[Calendar]", 
      measures: "[Measures].[Product Gross Profit Margin Status],[Measures].[Product Gross Profit Margin Goal]", 
     }); 

     this.selectorId = "dataSelector"; 
     this.gridId = "pivotGrid"; 

     this.optsGrid = { 
      dataSource: this.data, 
      height: "650px" 
     }; 

     this.optsSelector = { 
      dataSource: this.data, 
      height: "650px", 
      width: "30%" 
     }; 
    } 
} 

bootstrap(AppComponent); 

HTMLテンプレートコンポーネント - サンプル

http://igniteui.github.io/igniteui-angular2/samples/igPivotGrid-XmlaDataSource/igPivotGrid-XmlaDataSource.html

のIgnite UI-からigPivotGridを参照してください。これが役立つかどうかを見てください。

Answer 2

Flexmonster http://www.flexmonster.com/doc/integration-with-angular-2/からこのピボットコンポーネントを試しましたか？

良さそうに見えますが、