Почему мой компонент navbar не работает в Angular?

Question

Я очень новичок в Angular.В моем приложении Angular у меня есть папка navbar в src / app / components / navbar, и мой файл navbar.component.ts выглядит следующим образом:

navbar.component.ts

@Component({
  selector: 'app-navbar',
  templateUrl: './navbar.component.html',
  styleUrls: ['./navbar.component.scss']
})
export class NavbarComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

navbar.component.html

<p>nav bar is working</p>

index.html

<app-navbar></app-navbar>

, но когда я запускаю сервер localhost, онне отображается nav bar is working в моем index.html.как я могу это исправить?

Answer 1

Импортируйте navbar в app-module.ts и положите баланс <app-navbar></app-navbar> в app.component.html

Answer 2

Вы должны использовать свой компонент на странице app.component.html следующим образом -

<app-navbar></app-navbar>

Не в index.html, потому что это не ваш компонент начальной загрузки.

вы всегда используете <app-root></app-root>компонент в файле index.html, потому что это компонент, который загружается в основной модуль следующим образом -

bootstrap: [AppComponent]