Question

我有一个Jhipster网关应用程序，我想重用嵌套在两个不同父窗体中的搜索模式窗体。

我已将 ateco-search.component.ts 共享类放在 app / shared / model / subjects / utils 下：

app
 |_shared
   |_model
     |_subjects
       |_utils
         |_ ateco-search.component.ts
 |_entities
   |_subjects
     |_ateco
     |_demand

它看起来像：

import ...;

@Component({
    selector: 'ateco-search-component',
    template: `
        <div class="modal-header">
        ...
        </div>`
})
export class AtecoSearchComponent {...}

我想在ateco模块下调用它。在 ateco-update.component.ts 中，我有：

import {AtecoSearchComponent} from "app/shared";

@Component({
    selector: 'jhi-ateco-update',
    templateUrl: './ateco-update.component.html'
})
export class AtecoUpdateComponent implements OnInit {
    ...
    openSearchAtecoModal() {
        const modalRef = this.modalService.open(AtecoSearchComponent, {size: 'lg', ariaLabelledBy: 'modal-basic-title'});
        ...

同样在 demand-update.component.ts 的按需模块下，我有：

import {AtecoSearchComponent} from "app/shared";

@Component({
    selector: 'jhi-demand-update',
    templateUrl: './demand-update.component.html'
})
export class DemandUpdateComponent implements OnInit {
    ...
    openSearchAtecoModal() {
        const modalRef = this.modalService.open(AtecoSearchComponent, {size: 'lg', ariaLabelledBy: 'modal-basic-title'});

但是，当我运行该应用程序时，我无法进入ateco更新页面或需求更新页面，无法获取：

Error: Uncaught (in promise): Error: No NgModule metadata found for 'undefined'.

我应该如何共享 ateco-search.component.ts util类跨模块？

Answer 1

创建用于共享组件的Utils模块：

utils.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { AtecoSearchComponent } from './ateco-search/ateco-search.component';
import { GatewaySharedModule } from 'app/shared';

@NgModule({
    declarations: [AtecoSearchComponent],
    imports: [GatewaySharedModule, CommonModule],
    entryComponents: [AtecoSearchComponent],
    exports: [AtecoSearchComponent]
})
export class UtilsModule {}

将其导入到要使用它的组件的模块中（例如 demand.module.ts ）

@NgModule({
    imports: [GatewaySharedModule, RouterModule.forChild(ENTITY_STATES), UtilsModule],
     ...
})

使用共享组件：

const modalRef = this.modalService.open(AtecoSearchComponent, { size: 'lg', ariaLabelledBy: 'modal-basic-title' });
})

如何跨模块共享utils类

1 个答案: