无法使用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显示弹出框

回答

相关问题