無法使用kendo PopupService顯示彈出框

我們目前無法顯示任何需要彈出服務的kendo ui控件，我們目前嘗試使用的兩個控件是kendo-combobox和kendo-datepicker。無法使用kendo PopupService顯示彈出框

我們已經嘗試在我們的代碼中編寫kendo示例，但繼續得到相同的錯誤。

的錯誤是：

View容器未找到！通過appendTo選項注入POPUP_CONTAINER或定義特定的ViewContainerRef。查看http://www.telerik.com/kendo-angular-ui/components/popup/api/POPUP_CONTAINER瞭解更多詳情。

這是我們得到的錯誤，當我們試圖展開一個組合框，或者如果我們嘗試手動撥打：

this.popupService.open({ content: this.dialog })

上面的鏈接是不是非常有幫助，但我們試圖實現它最好的我們可以。

providers: [{ 
     provide: POPUP_CONTAINER, 
     useFactory:() => 
     { 
      return document.body.appendChild(document.createElement("kendo-popup")); 
      //return the container ElementRef, where the popup will be injected 
     } 
    }]

這是在我們的應用程序的boostrap模塊中完成的。首先，這似乎不應該是必要的。我們所看到的劍道拳擊手都沒有這種或任何其他形式的特殊彈出注射邏輯。

但是，即使試圖創建一個劍道彈出元素之後，我們現在在嘗試看到一個彈出此錯誤時：

ERROR TypeError: Cannot read property 'appendChild' of undefined 
    at PopupService.appendPopup (:2295/node_modules/@progress/kendo-angular-popup/dist/npm/popup.service.js:163) 
    at PopupService.open (:2295/node_modules/@progress/kendo-angular-popup/dist/npm/popup.service.js:130) 
    at PropertySelectorComponent.togglePopup (:2295/app/Upgrade/common/property-selector/property-selector.component.js:41) 
    at Object.eval [as handleEvent] (ng:///my_Company_CommonModule/PropertySelectorComponent.ngfactory.js:24) 
    at handleEvent (:2295/node_modules/@angular/core/bundles/core.umd.js:12029) 
    at callWithDebugContext (:2295/node_modules/@angular/core/bundles/core.umd.js:13490) 
    at Object.debugHandleEvent [as handleEvent] (:2295/node_modules/@angular/core/bundles/core.umd.js:13078) 
    at dispatchEvent (:2295/node_modules/@angular/core/bundles/core.umd.js:8633) 
    at eval (:2295/node_modules/@angular/core/bundles/core.umd.js:9244) 
    at HTMLButtonElement.eval (:2295/node_modules/@angular/platform-browser/bundles/platform-browser.umd.js:2685)

在這一點上，我能想到的唯一的事情是事實，我們正在使用角度升級模塊來支持Angular 1.5和Angular 4.並且彈出式容器可能無法正確生成或無法找到。

有關下一步嘗試的建議，以便獲得與劍道一起顯示的組合框。

來源

2017-08-29 Delta

mentioned documentation指出應該返回一個有效的ElementRef實例。換句話說，您需要返回一個將用作Popup容器的元素，僅此而已。

useFactory:() => ({ nativeElement: document.body } as ElementRef)

這裏是一個可運行的演示，演示了這種方法：

http://plnkr.co/edit/GOa7SjoWiKiYXvZTMTtL?p=preview

通知的document.body元素如何返回彈出容器，考慮到這一點的代碼應該是一樣簡單。

來源

2017-08-30 10:52:28

這工作！現在，如果只有某種方式可以瞭解到需要一個具有本機元素屬性的對象。 – Delta

ElementRef是一個Angular類型。您可以在Angular文檔中找到更多詳細信息 - https://angular.io/api/core/ElementRef –

無法使用kendo PopupService顯示彈出框

回答

相關問題