Динамическая загрузка CSS в angularjs (задержка загрузки)

Я использую два визуальных шаблона для определенного сайта, чей css конфликтует довольно немного, поэтому вместо того, чтобы делать болезненное редактирование, я решил, что динамическая загрузка сделает трюк.Динамическая загрузка CSS в angularjs (задержка загрузки)

Поэтому я использую это в моем <head>

<!-- css is loaded dynamically through angular --> 
<link ng-repeat="item in css.files" ng-href="{{item}}" rel="stylesheet">

И установить $rootScope.css.files внутри моего .config() моего модуля.

CSS загружается отлично, однако между загрузкой содержимого страницы и загрузкой CSS наблюдается заметная задержка. В основном, неидентифицированный html-дисплей показывается до тех пор, пока файлы CSS не будут полностью загружены.

Есть ли способ остановить показ страницы перед загрузкой CSS? Есть ли какое-либо событие для завершения загрузки элемента ng-href?

источник

2014-01-22 Matt Way

Использование 'ng-cloak' на вашем элементе тела может быть здесь. См. Http://docs.angularjs.org/api/ng.directive:ngCloak. – scarlz

Я посмотрел на ng-плащ, и он не решает проблему. –

Самый простой способ - просто использовать простой старый CSS.

В заголовке вашей страницы добавить следующее:

<style> 
    html, body { 
    display: none; 
    } 
</style>

Тогда в последнем CSS для загрузки, не отмените дисплей нет:

html, body { 
    display: block; 
    }

Последнее перекроет предыдущий, и ваша страница появится со всеми вашими динамическими css.

источник

2014-01-23 01:06:08

Проблема в том, что вы показываете контент до загрузки файлов CSS. Я не знаю, если у объекта HTMLLinkElement есть событие, когда оно загружено, но в основном вам нужно дождаться загрузки вашего CSS, прежде чем показывать контент. Использование ng-cloak здесь не поможет, потому что ng-cloak скрывает контент, пока угловой загружается, а не пока другие файлы загружаются.

источник

2014-01-23 00:22:29

Да, это всего лишь переосмысление вопроса. Любая попытка ответа? –

Это не просто переосмысление вопроса - я повторил проблему, а затем сказал, что 'ng-cloak' не будет работать и что ответ заключается в том, чтобы увидеть, имеет ли событие« HTMLLinkElement »событие при загрузке. В любом случае, похоже, Джонатан. В любом случае, Гаврич ответил лучшей идеей. –

Динамическая загрузка CSS в angularjs (задержка загрузки)

ответ

Смежные вопросы