PivotGrid及其選擇器未綁定/正常工作

Question

我開發了一個應用程序，使用Angular2，IgniteUI/Infragistics PivotGrid控件加載數據透視表。我們正在動態傳遞Cubes信息（即度量/維度）並將Json數據與PivotGrid綁定。我們使用由IgniteUI/Infragistics在其github演示中給出的Angular2包裝組件。

一個breif交代在這裏我的應用程序： -

工作簿是具有下拉父組件。下拉的Onchange事件將觸發PivotGrid組件，它是Workbook組件的子組件，用於加載和綁定PivotGrid。在PivotGrid網格被綁定/加載之後，它應該加載PivotGrid的選擇器。這個選擇器被放置在這個PivotGrid下的一個叫做slideout的子組件中。基本上，每當下拉列表發生變化時，它應該分別加載相應的PivotGrid及其選擇器組件。

1. 在工作簿是在父組件具有下拉菜單中，「的OnChange」當下拉值的變化，它會觸發在PivotGrid的ngOnChanges事件因爲其輸入事件觸發（）的參數的值被改變。
2. 在ngOnChanges事件期間的PivotGrid中，它調用綁定網格的本地方法LoadInfraPivotGrid（）。綁定網格後，我更改滑出組件的Input（）參數值，該參數值應該再次觸發滑出組件中的ngOnChanges事件。
3. 在ngOnChanges事件期間的滑出過程中，它綁定選擇器組件。
4. 要綁定選擇器組件的數據是使用包含數據的@Injectable組件SessionService從父PivotGrid傳遞的。這些值將從此SessionService讀取，然後與選擇器綁定。

我在這裏面臨的問題是數據沒有正確綁定/加載PivotGrid/Selector。結果是每當我嘗試更改選擇器中的度量/維度時，PivotGrid會崩潰並顯示以下錯誤消息。當我嘗試在選擇器控制中不斷更改/修改時，會發生此問題。

Uncaught TypeError: Cannot read property 'top' of undefined 
 
     at t.(anonymous function).(anonymous function)._positionOverlayDropAreas (http://localhost:3000/js/IgniteUI/infragistics.lob.js:662:19496) 
 
     at t.(anonymous function).(anonymous function)._positionOverlayDropAreas (http://code.jquery.com/ui/1.10.3/jquery-ui.min.js:5:5028) 
 
     at t.(anonymous function).(anonymous function)._onDataRendered (http://localhost:3000/js/IgniteUI/infragistics.lob.js:662:18161) 
 
     at t.(anonymous function).(anonymous function)._onDataRendered (http://code.jquery.com/ui/1.10.3/jquery-ui.min.js:5:5028) 
 
     at HTMLTableElement.dataRendered (http://localhost:3000/js/IgniteUI/infragistics.lob.js:661:12953) 
 
     at t.(anonymous function).(anonymous function)._trigger (http://code.jquery.com/ui/1.10.3/jquery-ui.min.js:5:10002) 
 
     at t.(anonymous function).(anonymous function)._renderData (http://localhost:3000/js/IgniteUI/infragistics.lob.js:138:17643) 
 
     at t.(anonymous function).(anonymous function)._renderData (http://code.jquery.com/ui/1.10.3/jquery-ui.min.js:5:5028) 
 
     at t.(anonymous function).(anonymous function).proxy (http://code.jquery.com/jquery-1.12.3.js:529:14) 
 
     at Class._invokeCallback (http://localhost:3000/js/IgniteUI/infragistics.core.js:270:30197)

請找到在URL

樣本源甚至當我向下鑽取的行的報告，它崩潰。 任何想法我在這裏做的錯誤是什麼？任何修復？

編輯： 現在我得到了一個不同的錯誤，我提到的錯誤/異常可以在示例代碼本身中重現。步驟來複制問題： -

1. 請從下拉菜單中，報告3被載入
2. 從「項目記分卡」拖放的「供應商」分列打開「報告3」（請參閱​​快照）
3. 將「零售商」拖放到「行」 在此之後，網格立即崩潰。

Uncaught TypeError: Cannot read property 'key' of undefined 
 
     at t.(anonymous function).(anonymous function)._transformGridData (http://localhost:3000/js/IgniteUI/infragistics.lob.js:661:23266) 
 
     at t.(anonymous function).(anonymous function)._transformGridData (http://code.jquery.com/ui/1.10.3/jquery-ui.min.js:5:5028) 
 
     at t.(anonymous function).(anonymous function)._configureOptions (http://localhost:3000/js/IgniteUI/infragistics.lob.js:661:12632) 
 
     at t.(anonymous function).(anonymous function)._configureOptions (http://code.jquery.com/ui/1.10.3/jquery-ui.min.js:5:5028) 
 
     at t.(anonymous function).(anonymous function)._onGridUpdated (http://localhost:3000/js/IgniteUI/infragistics.lob.js:661:26768) 
 
     at t.(anonymous function).(anonymous function)._onGridUpdated (http://code.jquery.com/ui/1.10.3/jquery-ui.min.js:5:5028) 
 
     at Class.<anonymous> (http://localhost:3000/js/IgniteUI/infragistics.lob.js:661:9410) 
 
     at Class.dispatch (http://code.jquery.com/jquery-1.12.3.js:5226:27) 
 
     at Class.elemData.handle (http://code.jquery.com/jquery-1.12.3.js:4878:28) 
 
     at Object.trigger (http://code.jquery.com/jquery-1.12.3.js:5130:12)

Answer 1

的爲widgetid屬性應最初設定首先創建樞軸網格時。 這應該做到無論聲明中InfraPivotGrid組件的gridId屬性時：

private gridId: string = "pivotGrid"; 

或者成類的構造函數：

constructor(private _SessionService: SessionService, private _WidgetConfigService: WidgetConfigService) { 
     console.log("In constructor of InfraPivotGrid"); 
     this.gridId = "pivotGrid"; 
    }