无法在 MatDialog 中使用来自其他模块的组件

Question

I have two modules, AModule and BModule.

AModule declares and exports a component, called ProductCardComponent, which has one input, which is

@Input() product: ProductModel

Now in BModule I import AModule and I'm opening a MatDialog which tries to render the product card as such:

<app-product-card [product]="product">

However, I get the error Can't bind to 'product' since it isn't a known property of 'app-product-card'. If I remove the binding, the component doesn't render at all, which gives me the impression that it simply cannot find the component. I can use it in other places alright.

What am I missing here?

UPDATE: as I was fiddling around I realised other things like *ngFor and async also didn't work, as if the component wasn't in any module declaration, but still functioned. I then realised the module was lazy loaded. I added BModule to the imports of my main AppModule, and behold, it all started functioning!

Answer 1

正如我所看到的，您使用的是不同的模块 A 和 B。在这种情况下，这将不起作用，您应该使用要使用的组件创建一个共享模块，导出这些组件，然后在其他模块中导入共享模块