Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了Angular 6:功能模块之间的共享组件不起作用大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我创建了2个功能模块(PagesSharedModule& HomeModulE).
现在我正在尝试使用来自HomeModule& amp;组件模板中的PagesSharedModule的导出组件.我收到此错误
ERROR Error: Uncaught (in promisE): Error: Template parse errors: 'app-main-menu' is not a kNown element:
1. If 'app-main-menu' is an Angular component,then verify that it is part of this module.
2. If 'app-main-menu' is a Web Component then add 'CUSTOM_ELEMENTS_scheR_993_11845@A' to the '@NgModule.scheR_993_11845@as' of this component to suppress this message. ("[ERROR
->]<app-main-menu></app-main-menu>"): ng:///HomeModule/HomeComponent.html@0:0 Error: Template parse errors: 'app-main-menu' is not a kNown element:
1. If 'app-main-menu' is an Angular component,then verify that it is part of this module.
2. If 'app-main-menu' is a Web Component then add 'CUSTOM_ELEMENTS_scheR_993_11845@A' to the '@NgModule.scheR_993_11845@as' of this component to suppress this message. ("[ERROR
->]<app-main-menu></app-main-menu>"): ng:///HomeModule/HomeComponent.html@0:0
    at SyntaxError (compiler.js:215)
    at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (compiler.js:14687)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (compiler.js:22687)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (compiler.js:22674)
    at compiler.js:22617
    at Set.forEach (<anonymous>)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:22617)
    at compiler.js:22527
    at Object.then (compiler.js:206)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:22526)
    at SyntaxError (compiler.js:215)
    at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (compiler.js:14687)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (compiler.js:22687)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (compiler.js:22674)
    at compiler.js:22617
    at Set.forEach (<anonymous>)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:22617)
    at compiler.js:22527
    at Object.then (compiler.js:206)
    at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:22526)
    at resolvePromise (zone.js:814)
    at resolvePromise (zone.js:771)
    at zone.js:873
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3751)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
@H_944_4@如果它有任何区别,HomeModule是一个路由延迟加载的模块.

@H_944_4@我的代码

@H_944_4@SRC /应用程序/页/页共享/页-shared.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { MainMenuComponent } from './main-menu/main-menu.component';

@NgModule({
  imports: [
    CommonModule
  ],declarations: [
    MainMenuComponent
  ],exports: [
    MainMenuComponent
  ]
})

export class PagesSharedModule { }
@H_944_4@SRC /应用程序/页/页共享/主菜单/主menu.component.ts

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

@Component({
  SELEctor: 'app-main-menu',templateUrl: './main-menu.component.html',styleUrls: ['./main-menu.component.scss']
})
export class MainMenuComponent implements OnInit {
  constructor() { }
  ngOnInit() { }
}
@H_944_4@SRC /应用/网页/家/ home.module.ts

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HomeComponent } from './home.component';
import { HomeRoutIngModule } from './home-routIng.module';
import { PagesSharedModule } from 'src/app/pages/pages-shared/pages-shared.module';

@NgModule({
  imports: [
    CommonModule,HomeRoutIngModule,PagesSharedModule
  ],declarations: [
    HomeComponent
  ]
})

export class HomeModule { }
@H_944_4@SRC /应用/网页/家/ home.component.html

<app-main-menu></app-main-menu>
@H_944_4@SRC /应用/网页/网页,routIng.module.ts

...
{
  path: '',component: PagesComponent,children: [
    {
      path: '',pathMatch: 'full',loadChildren: './home/home.module#HomeModule'
    },{
      path: 'about',loadChildren: './content/content.module#ContentModule'
    },{ path: '**',component: PageNotFoundComponent }
  ]
},...
@H_944_4@SRC /应用/网页/家庭/家庭routIng.module.ts

{
  path: '',component: HomeComponent
}
@H_944_4@我做错了什么?谢谢.

更新:令人难以置信!!!我停止了角度CLI&再次服务&现在它完全正常工作,代码没有任何变化.请留下这个说明,以防万一其他人面临同样的问题……

大佬总结

以上是大佬教程为你收集整理的Angular 6:功能模块之间的共享组件不起作用全部内容,希望文章能够帮你解决Angular 6:功能模块之间的共享组件不起作用所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。