angular - 断言错误:传入的类型不是 ComponentType,它没有 'ɵcmp' 属性
问题描述
每当应用程序运行时我都会收到此错误,但不会导致我在当前开发中出现问题(我认为)我想了解此错误并知道它来自哪里,因为我完全迷路了,我什至无法发布相关信息代码。不过我会试试的。。
所以这些是主要路线(appModule):
const routes: Routes = [
{path:'home', component:HomeComponent, canActivate:[AuthGuardService]},
{path:'detail/:id', component:DetailComponent},
{path: 'register', component: RegisterComponent},
{path:'login', component: LoginComponent},
{path:'', redirectTo:'login', pathMatch: 'full'},
{path:'**', redirectTo:'login'}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
我有一个核心模块,其中注册了所有组件,并且我正在导入RouterModule.forChild([])
:
@NgModule({
declarations: [HomeComponent, DetailComponent, RegisterComponent, LoginComponent],
imports: [
CommonModule,
FormsModule,
ReactiveFormsModule,
RouterModule.forChild([])
]
})
export class CoreModule { }
包.json:
{
"name": "mat-shop",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "~9.1.9",
"@angular/cdk": "^9.2.4",
"@angular/common": "~9.1.9",
"@angular/compiler": "~9.1.9",
"@angular/core": "~9.1.9",
"@angular/forms": "~9.1.9",
"@angular/localize": "~9.1.9",
"@angular/material": "^9.2.4",
"@angular/platform-browser": "~9.1.9",
"@angular/platform-browser-dynamic": "~9.1.9",
"@angular/router": "~9.1.9",
"@ng-bootstrap/ng-bootstrap": "^6.1.0",
"bootstrap": "^4.4.0",
"rxjs": "~6.5.4",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.901.7",
"@angular/cli": "~9.1.7",
"@angular/compiler-cli": "~9.1.9",
"@types/node": "^12.11.1",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^5.1.2",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~2.1.0",
"karma-jasmine": "~3.0.1",
"karma-jasmine-html-reporter": "^1.4.2",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~3.8.3"
}
}
编辑应用模块
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule,
HttpClientModule,
BrowserAnimationsModule,
CoreModule,
NgbModule
],
providers: [DataService, fakeBackendProvider, AuthService, AuthGuardService, ShoppingCartService ],
bootstrap: [AppComponent, HttpClient]
我从未见过这个错误。它是 Angular 9 的问题吗?难道我做错了什么?
解决方案
此错误可能是由于两个常见错误
当您加载模块而不是组件时,反之亦然,则会出现此错误。
1.加载模块而不是组件,即
{
path: 'login',
component: LoginModule // mistake
}
2.加载组件而不是模块,即
{
path: 'login',
loadChildren: () => import('./login.module').then(m => m.LoginComponent) // mistake
}
推荐阅读
- tableau-api - 如果总和为0,如何对记录总数求和并隐藏?
- angular - 离子不导入 ngx-mathjax 模块
- oracle - 如何使用绑定变量处理 sys-refcursor 中的 NO_DATA_FOUND
- websocket - 我使用 wscat 或通过 node.js 调用 AWS API Gateway Websocket Route 时出错
- python - 如果列在列表的任何部分中,则过滤数据框
- jquery - Ajax 自定义参数列表
- android - 使用改造 Message.replyto 的 Android 绑定服务为空
- sql-server - 如何使用输入和输出参数调用 SQL Server 过程?
- c# - 如何在 nunit 中正确获取控制器的结果?
- c++ - 有人可以帮我正确运行这个程序吗