Угловой код внутри корневого тега приложения неправильно обрабатывает стиль - PullRequest
0 голосов
/ 13 февраля 2019

У меня проблема с приложением Angular 7 при инициализации.У меня есть класс под названием «тестирование», и все, что он делает, это меняет цвет текста на красный.У меня был класс, указанный в файле index.html внутри тега style или в файле styles.scss со всеми моими глобальными стилями.Я тестировал оба способа с одинаковыми результатами.Я использую angular / cli и ng serve для тестирования моего приложения, и вот как я выложил свою страницу index.html:

<body>
  <app-root>
    <div class="container">
      <span class="testing">Application is loading, please wait...</span>
    </div>
  </app-root>
</body>

Ожидание: Текст внутриspan должен быть красным с небольшим отступом (через класс контейнера начальной загрузки).

Фактические результаты:

  1. Когда я набираю localhost: 4200 в URL и нажимаювведите, текст отображается в верхнем левом углу экрана без красного цвета, прежде чем приложение будет отображено.
  2. Если я нажимаю обновление, происходит то же самое, что и # 1.
  3. Если я нажимаю shift + refresh, в течение доли секунды происходит # 1 до того, как текст попадает в абзац контейнера начальной загрузки и изменяетсяна красный.

Может ли кто-нибудь объяснить мне, что здесь происходит, и что мне нужно сделать, чтобы №3 произошел без каких-либо изменений стиля доли секунды?Если вам нужна дополнительная информация, пожалуйста, дайте мне знать.

1 Ответ

0 голосов
/ 13 февраля 2019

Во-первых, это неправильный способ написать даже одно слово в теге, потому что он ведет себя как шаблонная директива или вы можете сказать, что пустое поле заполняется содержимым app.component.html, и именно поэтому вы наблюдаете малоflick (появляется перед рендерингом) и лучший способ записать свой контент в app.component.html и стилизовать его через app.component.css / app.component.scss, или вы можете записать этот css в основной файл для css (style.css)но каждый класс должен быть в своем стиле компонента.Поскольку angular касается отдельных модулей / компонентов / секций.

Надеюсь, это поможет вам

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...