延迟加载模块中的角度材料未知元素错误答案

【问题标题】：Angular material not known element error in lazy loaded module延迟加载模块中的角度材料未知元素错误
【发布时间】：2021-12-18 11:48:45
【问题描述】：

我在共享模块方法中遇到了一个奇怪的问题

在我的共享模块中，我有以下内容

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import {MatFormFieldModule} from '@angular/material/form-field';
import {MatInputModule} from '@angular/material/input'
import {MatButtonModule} from '@angular/material/button';


    @NgModule({
      declarations: [],
      imports: [
        CommonModule,
        MatFormFieldModule,
        MatInputModule,
        MatButtonModule
      ],
      exports:[MatFormFieldModule,MatInputModule,MatButtonModule]
    })
    export class SharedModule { }

我有一个登录模块，它在应用模块中延迟加载

const routes: Routes = [

  {
  path: 'login',
  loadChildren: () => import('@app/modules/login/login-routing.module').then(m => m.LoginRoutingModule)
}];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

在登录模块中，我已经导入了共享模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { LoginComponent } from './login/login.component';
import {SharedModule} from '@app/modules/shared/shared.module'

@NgModule({
  declarations: [
    LoginComponent
  ],
  imports: [
    CommonModule,
    SharedModule
  ]
})
export class LoginModule { }

但是在 LoginComponent 中添加表单字段时，我正在获取元素未知错误

nt:
1. If 'mat-form-field' is an Angular component, then verify that it is part of this module.
2. If 'mat-form-field' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

不知道为什么在延迟加载的模块中会发生这种情况

角度版本：12 CLI 版本：12.2

【问题讨论】：

标签： javascript angular typescript angular-material

【解决方案1】：

您的路由似乎错误。您正在加载 LoginRoutingModule 而不是 LoginModule

【讨论】：

似乎是路由空的另一个问题

【解决方案2】：

如果您在“您的路由似乎错误。您正在加载 LoginRoutingModule 而不是 LoginModule”之后遇到一些问题，请尝试在您的导入中添加 - loginModule 这个：

imports:[
...,
RouterModule.forChild(
  [
    { 
      path:'', 
      component:LoginComponent
    }
  ]),
...

【讨论】：