在AngularJS应用程序中动态加载和卸载外部样式表

时间:2014-11-25 13:06:31

标签: javascript angularjs stylesheet dynamic-loading

我的AngularJS应用程序中有两个使用冲突CSS的路径/视图。我有两个独立的外部样式表,我想用于这些路线。例如,foo.css路由为foobar.css路由为bar。这样我就能解决冲突。

但是,从bar.css导航到foo.css时,我必须加载foo并卸载bar

我该怎么做?是否有可以帮助我实现这种情况的库/模块?

我查看了ocLazyLoad,但我不确定如何卸载加载的CSS。

1 个答案:

答案 0 :(得分:3)

AngularJS Way

在下面的评论中,OP在AngularJS中建议了最适合我的方式 - 使用ng-disabled指令。您只需要<html> ng-app属性元素,以便正确执行指令。

<link rel="stylesheet" href="/path/to/style-1.css" ng-disabled="theme.name === 'theme1'">
<link rel="stylesheet" href="/path/to/style-2.css" ng-disabled="theme.name === 'theme2'">

这样两种样式都会立即加载(以后不会导致更改闪烁)。如果某些样式最初,则需要采用不同的方法。

原始答案

this question。然后,只需找到相应的<link>标记,然后随意启用/禁用它们。我不认为这与AngularJS有任何关系。