Почему стили из .css файла не применяются к компоненту Angular?

Я пытаюсь воссоздать компонент app-part-slot из моего React проекта в Angular, но ни один из стилей из файла css не применяется к нему. Стили появляются внутри тега head, но браузер на них никак не реагирует.
Я создал этот компонент с помощью команды CLI и получил следующую файловую структуру:
part-slot
| part-slot.component.css
| part-slot.component.ts
...

Путь к css файлу был автоматически подставлен в декоратор Component. Я перепроверил, что этот путь действителен, IDE указывает на нужный файл, когда я нажимаю «Go to definition». Вот как выглядит декоратор:
@Component({
  selector: 'app-part-slot',
  standalone: true,
  imports: [],
  templateUrl: './part-slot.component.html',
  styleUrl: './part-slot.component.css'
})

Я пробовал заменить styleurl на styleurls в декораторе, не сработало. Я также попробовал импортировать этот css файл в styles.css, не совсем уверен, что это то, что нужно делать в моей ситуации, но это все равно это не помогло. Сам CSS код кажется корректным, по крайней мере, с React он работал нормально.

Версия Angular - 17.1.2. Если нужно заглянуть в какой-нибудь из файлов, то я их выложу.
Заранее спасибо за помощь.
  • Вопрос задан
  • 37 просмотров
Пригласить эксперта
Ответы на вопрос 1
@probox36 Автор вопроса
Проблема оказалась в разметке, которую я скопировал из React проекта, в частности в атрибуте className html элементов:
<div className='IconMountUpper'>
Angular вместо него использует атрибут class:
<div class='IconMountUpper'>
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы