在Angular2中擴展PrimeNg組件

由於某些使用情況，我需要在Angular2中擴展PrimeNG組件。爲了打樣紫袍，我選擇使用DataTable，因爲它很複雜。在Angular2中擴展PrimeNg組件

逐字複製粘貼@Component註釋後，我說：

export class PPDataTable extends DataTable {}

在這一點上，我得到以下錯誤：No provider for DataTable。如果我在註釋中將DataTable添加到providers數組中，則我的DataTable的內容爲空。

因此我試着加入：{ provide: DataTable, useValue: PPDataTable }，它產生了一些錯誤，如：TypeError: co.dt.isSorted is not a function。我嘗試在新類中記錄this.isSorted，它確實存在。

如何擴展這樣的東西？

此外，有更好的解決方案來改變PrimeNg組件的選擇器名稱（以某種方式包裝它）？

編輯

尋找更多一些通過調試堆棧，我發現在這之後：

看來，而不是直接提供對象，我提供包含對象的數組，這是（根據我的猜測）錯誤的原因。如果我進入源代碼並將其更改爲dt[0].isSorted()，它可以工作！

如何直接提供對象？

回答

看來，如果我提供{ provide: DataTable, useExisting: PPDataTable }它的工作原理。

來源

2017-06-13 user1640736

嘗試了這一點我的好朋友：

import { Component, forwardRef } from '@angular/core'; 
import { NG_VALUE_ACCESSOR } from '@angular/forms'; 
import { PrimeNgClassToExtend } from 'path'; 

const DATATABLE_VALUE_ACCESSOR: any = { 
    provide: NG_VALUE_ACCESSOR, 
    useExisting: forwardRef(() => MyClassThatIsExtending), 
    multi: true 
}; 

@Component({ 
    selector: 'my-class-extending', 
    providers: [DATATABLE_VALUE_ACCESSOR], 
    template: `` 
}) 
export class MyClassThatIsExtending extends PrimeNgClassToExtend { 
}

我們使用NG_VALUE_ACCESSOR爲了您的自定義控制與控制值訪問連接到ngModel。

檢查this tutorial也可以。

來源

2017-06-13 11:00:22 SrAxi

我仍然得到了問題中所解釋的TypeError。 – user1640736

感覺好像我正確提供了'ExtendingClass'，但由於某種原因，使用'@Inject（forwardRef（（=）DataTable））public dt：DataTable'的組件無法訪問'dt'上的函數。此外，即使我手動覆蓋擴展函數上的方法也不起作用，但仍然未定義。 – user1640736

@ user1640736嘗試'構造函數（@Inject（forwardRef（（）=> DataTable））dt）{}'。 – SrAxi

在Angular2中擴展PrimeNg組件

回答

相關問題