Состояние загрузки стиля перед запуском приложения Angular2?

Question

В моем index.html, я хочу показать пользователям состояние загрузки до запуска/bootstraps приложения Angular2.

<my-app> 
    <div class="sk-cubes"> 
     <div class="sk-cube1"></div> 
     <div class="sk-cube2"></div> 
    </div> 
    </my-app> 

Я пытаюсь дать стили в таблице стилей под названием погрузо-state.css и включения его в index.html, но почему-то не принимает стили из этого файла. Тем не менее, я получаю ожидаемое поведение при предоставлении стилей в тегах в заголовках или встроенных стилях. Я что-то пропустил?

Answer 1

Я полагаю loading-state.css ссылка была приведена в head теге index.html страницы

В myapp компонента, установите ViewEncapsulation в none.

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

@Component({ 
    moduleId: module.id, 
    selector: 'myapp', 

    encapsulation: ViewEncapsulation.None // <<<=====here 

}) 
class MyAppComponent { 

}