Question

我不习惯Angular 2路由器那么多。我写了一个HomeComponent，它对我来说很好。现在，当我在路由器中使用它时，它将显示在组件名称中（而不是通过选择器）。因此，我的页面输出具有Homecomponent，而不使用其装饰器中定义的选择器。

现在我收到一个警告，选择器“main-home”与任何元素都不匹配。

请建议我如何删除此错误。我应该改变我的页面组件结构。

app.module.ts

Content

app.component.html

import { RouterModule, Routes } from '@angular/router';

const routes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'about-us', component: LoginComponent}

home.component.ts

<app-header></app-header>
<main>
  <router-outlet></router-outlet>
</main>

错误/警告

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

@Component({
  selector: 'main-home',
  templateUrl: './home.compoment.html',
  styleUrls: ['./home.component.css']
})
export class HomeComponent {}

/ *已更新* /

现在我使用SystemJS设置进行了相同的测试，没有出现任何错误。此问题仅适用于webpack设置。请建议如何删除/避免此错误。

在plnkr上检查此代码： https://plnkr.co/edit/MasUPOPbakYULpWIOX6w?p=preview

Answer 1

我也得到了这个错误最后我发现我引导了一些没有在index.html中使用的组件我通过从AppModule的引导程序列表

中删除这些组件来修复错误

在Router中使用组件时，选择器与任何元素都不匹配

1 个答案: