将模块放入组件中，角度答案

【问题标题】：Put module into component, angular将模块放入组件中，角度
【发布时间】：2021-06-01 11:02:48
【问题描述】：

我需要将 mdbModal 放入组件中，但该组件没有 module.ts 存档，当尝试这个动作时，我得到：

ERROR Error: Uncaught (in promise): Error: Export of name 'mdbModal' not found!
Error: Export of name 'mdbModal' not found!

我的集体项目中没有示例，可以在组件中导入模块的方法是什么？

我对角度比较陌生。

<div
  mdbModal
  #basicModal="mdbModal"
  class="modal right modal-scroll"
  tabindex="-1"
  role="dialog"
  aria-labelledby="myBasicModalLabel"
  aria-hidden="true"
  >
  ...
</div>

这是我的父模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {
  ModalModule,
  WavesModule,
  InputsModule,
  ButtonsModule,
  CheckboxModule,
} from 'angular-bootstrap-md';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { SharedModule } from '../shared/shared.module';
import { NgxPaginationModule } from 'ngx-pagination';

import { PrimeDetailRoutingModule } from './prime-detail-routing.module';
import { PrimeDetailComponent } from './prime-detail.component';


@NgModule({
  declarations: [PrimeDetailComponent],
  imports: [
    CommonModule,
    PrimeDetailRoutingModule,
    SharedModule,
    NgxPaginationModule,
    ModalModule,
    WavesModule,
    InputsModule,
    ButtonsModule,
    CheckboxModule,
    FormsModule,
  ]
})
export class PrimeDetailModule { }

如果我在父模块中导入 mdbModal 没有问题，但是如果我需要在没有 module.ts 的情况下将其放入组件中

【问题讨论】：

您能分享一下您如何尝试将 mdbModal 导入您的项目的代码吗？
我们可以在声明组件的模块中导入需要的模块。
@WangLiang 我应该把 html 标签放到组件或父模块的哪里？？
@Keimeno 我举了一个例子，在尝试将html标签放入父模块后，它是一样的

标签： javascript angular module components

【解决方案1】：

prime.module.ts：

import {
  ModalModule,
  WavesModule,
  InputsModule,
  ButtonsModule,
  CheckboxModule,
} from 'angular-bootstrap-md';
…
@NgModule ({
  ...
  imports: [ModalModule.forRoot(),],
  ...
})

https://mdbootstrap.com/docs/b5/angular/pro/installation/

【讨论】：

我需要在组件文件夹中创建一个 module.ts 文件吗？有可能吗？？
不，不需要新建模块文件
好的，我尽快试试

【解决方案2】：

我的解决方案是，如果组件位于 Module Father 内部，则可以将 Component 与 Module 放在一起，例如：

应用程序
- 我的网站
  - 组件
  - my-site.component.ts
  - my-site.module.ts
  - 等

你可以把新组件放在这个目录下

ng generate component MySite/components/first-component --module app/MySite

之后，在父module.ts中你会看到如下内容：

import { FirstComponentComponent } from './components/first-component/first-component.component';

@NgModule({
  declarations: [FirstComponentComponent],
})

【讨论】：