[英]Ngx-Bootstrap Popover and Ngx-popover name reference conflict
I'm working in a project that is been working with ngx-popover but it is limited for a specific case. 我正在使用一个与ngx-popover合作的项目,但它仅限于特定情况。
I want to keep working with both libs but im getting some conflicts because the implementation is so similar. 我想继续使用两个库,但我得到一些冲突,因为实现是如此相似。
Module 模
import { PopoverModule } from "ngx-popover";
import { PopoverModule as PopoverBModule } from "ngx-bootstrap";
imports:
[
...,
PopoverModule,
PopoverBModule.forRoot(),
],
HTML ngx-bootstrap: HTML ngx-bootstrap:
<ng-template #popTemplate let-message="message">{{ message }}</ng-template>
<button type="button" class="btn btn-primary"
[popover]="popTemplate" [popoverContext]="context" [outsideClick]="true">
Open popover with custom context
</button>
HTML ngx-popover: HTML ngx-popover:
<i[popover]="popId"></i>
<popover-content
#popId
placement="above|auto"
[animation]="true"
[closeOnClickOutside]="true">
....
</popover-content>
I dont have any compilation error the problem is when I try to perform the ngx-bootstrap popover it is pointing directly to ngx-popover. 我没有任何编译错误问题是当我尝试执行ngx-bootstrap popover时它直接指向ngx-popover。
ERROR TypeError: Cannot read property 'subscribe' of undefined at Popover.push../node_modules/ngx-popover/Popover.js.Popover.show (Popover.js:114) at Popover.push../node_modules/ngx-popover/Popover.js.Popover.toggle (Popover.js:67) at Popover.push../node_modules/ngx-popover/Popover.js.Popover.showOrHideOnClick (Popover.js:37) at Object.eval [as handleEvent] (VimeoVideoListComponent.html:24) at handleEvent (core.js:19628) at callWithDebugContext (core.js:20722) at Object.debugHandleEvent [as handleEvent] (core.js:20425) at dispatchEvent (core.js:17077) at core.js:17524 at HTMLButtonElement.
ERROR TypeError:无法在Popover.push中读取未定义的属性'subscribe'.. / node_modules / ngx-popover / Popover.js.Popover.show(Popover.js:114)在Popover.push ../ node_modules / ngx-popover /Popover.js.Popover.toggle(Popover.js:67)位于Object.eval的Popover.push ../ node_modules / ngx-popover / popover.js.Popover.showOrHideOnClick(Popover.js:37)[as handleEvent] (VimeoVideoListComponent.html:24)在handleEvent(core.js:19628)的callWithDebugContext(core.js:20722)处于Object.debugHandleEvent [as handleEvent](core.js:20425)at dispatchEvent(core.js:17077)at at core.js:17524 at HTMLButtonElement。 (platform-browser.js:993)
(平台browser.js:993)
The question is: There is a way to force the directive [popover] point to ngx-bootstrap but just in this spesific case? 问题是: 有一种方法可以强制指令[popover]指向ngx-bootstrap但只是在这种特殊情况下?
by doing somethinlike [PopoverBModule.popover] it doesnt work LOL 做一些类似[PopoverBModule.popover]它不起作用LOL
The solution was create a module to import ngxbootstrap and my component, and just import the module instead import the VimeoVideoListComponent in the parent module. 解决方案是创建一个模块来导入ngxbootstrap和我的组件,然后导入模块而不是导入父模块中的VimeoVideoListComponent。
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { PopoverModule } from "ngx-bootstrap";
import { VimeoVideoListComponent } from './vimeo-video-list.component';
@NgModule({
declarations: [
VimeoVideoListComponent
],
exports:[VimeoVideoListComponent],
imports: [
CommonModule,
PopoverModule.forRoot()
]
})
export class VimeoVideoListModule { }
Thanks @Gilsdav 谢谢@Gilsdav
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.