Question

我有两个模块gridusers模块和用户模块。网格模块将列出数据表中的所有用户，当我点击动作项目编辑时，它会打开一个弹出窗口来编辑用户。使用编辑用户，我尝试在用户模块中创建组件。当我尝试在gridusers模块中使用该编辑用户组件时，我收到错误：

模板解析错误和未捕获（在承诺中）：错误：模板解析   错误：＆＃39; app-edit-user＆＃39;不是一个已知元素：


如果＆＃39; app-edit-user＆＃39;是一个Angular组件，然后验证它是否是该模块的一部分。

如果＆＃39; app-edit-user＆＃39;是一个Web组件，然后添加＆＃39; CUSTOM_ELEMENTS_SCHEMA＆＃39;到了＆＃39; @ NgModule.schemas＆＃39;这个组件   压制此消息。

对此有何帮助？

gridmodule
  -- gridmodule.ts
  -- gridcomponent.ts
  -- gridcomponent.html
  -- gridcomponent.scss

usermodule
  -- usermodule.ts
  -- usercomponent.ts
  -- usercomponent.html
  -- editusercomponent.ts
  -- editusercomponent.html
  -- usercomponent.scss
  -- editusercomponent.scss

editusercomponent.ts

import { Component } from '@angular/core';

@Component({
  selector: 'app-edit-user',
  templateUrl: './editusercomponent.html',
  styleUrls: ['./editusercomponent.scss']
})
export class editusercomponent{
  title = 'edit user';
}

gridmodule.ts

@NgModule({
    declarations: [
        editusercomponent
    ],
    imports: [
        .-----
    ],
})

Answer 1

如果您希望其他模块使用您的组件，您必须将其导出到您的模块中

试试这个

@NgModule({
    declarations: [
        editusercomponent
    ],
    imports: [
        .-----
    ],
    exports: [editusercomponent]
})

Answer 2

使用@ngModule's exports数组。默认情况下，declarations数组中定义的每个元素都是私有的。你应该只导出我们的应用程序中需要执行其工作的任何其他模块。

usermodule.ts

import { CommonModule } from '@angular/common';
    @NgModule({
       imports:[CommonModule],
        declarations: [
            editusercomponent
        ],
       exports:[ editusercomponent]
    })

<强> gridmodule.ts
在gridmodule的imports数组

中使用Regsiter usermodule

 import { UserModule } from '../user-module/user.module';
    @NgModule({
      imports: [
        BrowserModule,
       UserModule
      ],
      declarations: [],
      bootstrap: []
    })

角度调用组件从一个模块到另一个模块

2 个答案: