Почему фигурные скобки в моем коде html приложения Angular не компилируют то, что внутри них?

Question

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

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'AngularCV';
}

Есть свойство с именем «title», которое я хочу использовать в моем html коде. Мой app.component.html:

<div>
    {{title}}
</div>

После запуска живого сервера браузер отображает именно то, что я набрал без компиляции, поэтому я вижу на веб-странице «{{title}}» вместо «AngularCV» Я искал похожие проблемы, но ничего не помогло. Может быть, это банально, но сейчас я в тупике.

Answer 1

Хорошо, я только что создал новое приложение angular и изменил мои текущие файлы html, чтобы они соответствовали тем, которые были созданы в новом приложении. Все работает как надо. Насколько я понимаю, src / index. html должен содержать только голову и пустое тело с меткой. И все, кроме головы, нужно поместить в app.component. html. Надеюсь, что это поможет кому-то в будущем.