选择器“app-root”与 Angular 中的任何元素都不匹配

Question

大家下午好！

我遇到了消息“选择器“app-root”与任何元素都不匹配”的问题。角度 17.3.5.

我正在从 Angular 2 迁移到 17，并且正在创建一个研究项目。

我在使用独立组件时遇到了一些困难。我在哪里使用它们。

我创建了一个名为 Home 的组件，在其中导入了 NavBarComponent 元素。

但是，如果我搜索我的项目，我永远不会使用选择器，但我会在浏览器控制台中收到此消息。

Error: NG05104: The selector "app-root" did not match any elements. Find more at https://angular.io/errors/NG05104
    at DefaultDomRenderer2.selectRootElement (platform-browser.mjs:654:13)
    at locateHostElement (core.mjs:11436:34)
    at ComponentFactory.create (core.mjs:15806:17)
    at _ApplicationRef.bootstrap (core.mjs:31460:42)
    at core.mjs:35074:32
    at _ZoneDelegate.invoke (zone.js:368:26)
    at Object.onInvoke (core.mjs:14882:33)
    at _ZoneDelegate.invoke (zone.js:367:52)
    at _Zone.run (zone.js:130:43)
    at zone.js:1260:36

应用程序可以毫无错误地构建和上传，但我在系统的任何屏幕上都会遇到此异常

app-root 选择器位于 app.component.ts 类内部

import { Component } from '@angular/core';
import { RouterOutlet } from '@angular/router';
import { HomeComponent } from './home/home.component';

@Component({
  selector: 'app-root',
  standalone: true,
  imports: [RouterOutlet, HomeComponent],
  templateUrl: './app.component.html',
  styleUrl: './app.component.css',
})

export class AppComponent {
  title = 'angular-consumer';
}

但它绝不会导入到我创建的任何组件中，并且我不在项目中使用它。

我尝试访问的组件是主页。

import { Component, OnInit } from '@angular/core';
import { NavbarComponent } from '../navbar/navbar.component';

@Component({
  standalone:  true,
  selector: 'app-home',
  templateUrl: './home.component.html',
  imports: [NavbarComponent],
  styleUrls: ['./home.component.css']
})


export class HomeComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}

在我的 app.component.html 文件中声明如下

<app-home></app-home>

我的带有@Component的类用standalone = true进行注释。

Angular 的文档提到这可能是由于使用了选择器，但在我的项目中我从未使用过

我尝试通过搜索论坛来解决打开组件的问题

Answer 1

大家晚上好！

感谢@Thomas Renger提示，将

<app-root></app-root>

放入index.html解决了我的问题。

我认为这是 Angular 本身的一个指令，使这个文件成为强制性的。感谢所有花时间帮助我的人