自定义模块的组件忽略 AppModule 中的顶级声明

Question

在这个页面上搜索了很久，我还是迷路了。

我有一个 AppModule 和一个 ModalModule。 AppModule 正在导入 ModalModule

AppModule 使用此装饰器属性声明 LoaderComponent：

selector: 'my-loader', template: '<div>...</div><ng-content></ng-content>'

ModalModule 声明 ModalComponent。

在 ModalComponent 的模板里面我要使用 LoaderComponent:

<my-loader><h3>Loading...</h3><p>Just information text.</p></my-loader>

这不起作用！

'my-loader' is not a known element:
1. If 'my-loader' is an Angular component, then verify that it is part of this module.
2. If 'my-loader' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

如果我将 CUSTOM_ELEMENTS_SCHEMA 添加到 ModalModule，它只会忽略元素并且 DOM 看起来像这样：

<my-loader>
  <h3>Loading...</h3>
  <p>Just information text.</p>
</my-loader>

但我希望它通过 angular 渲染，看起来像这样：

<my-loader>
  <div>...</div> <!-- should be coming from LoaderComponent template -->
  <h3>Loading...</h3>
  <p>Just information text.</p>
</my-loader>

有人有想法吗？

Answer 1

清理和使用 SharedComponent 有帮助！

Angular2 How to clean up the AppModule

我必须做的唯一区别是将 CommonModule 和 FormsModule 添加到 SharedModule 的导入中！