AngularJS在用户选择上切换CSS主题
我从bootswatch下载了主题，并试图允许用户切换主题。切换主题后，所有引导CSS都会暂时消失，直到加载新主题为止。在加载CSS之前如何防止更改，或者在加载新主题之前切换回默认主题？
index.ejs（在头）
<link rel="stylesheet" href="/external/bootstrap/css/bootstrap_yeti.min.css"
ng-if="myTheme == ''">
<link rel="stylesheet" ng-href="/external/bootstrap/css/bootstrap_{{myTheme}}.min.css"
ng-if="myTheme != ''">
选拔
<select class="form-control"
id="theme"
name="theme"
ng-model="theme"
ng-change="newTheme()">
<option value="" disabled>Select Theme</option>
<option ng-repeat="(key, val) in availableThemes" value="{{val}}">{{key}}</option>
</select>
索引控制器
$scope.myTheme = '';
$rootScope.$watch('myTheme', function(value) {
if (value != undefined) {
$scope.myTheme = value;
}
});
选择控制器
$scope.availableThemes = {
Cerulean: 'cerulean',
Cosmo: 'cosmo',
Yeti: 'yeti'
};
$scope.newTheme = function() {
console.log($scope.theme);
if ($scope.theme != undefined) {
$rootScope.myTheme = $scope.theme;
}
}
任何帮助表示赞赏！谢谢
问题答案：
我认为这不是AngularJS的问题。我认为您的方法应该有所不同。
据我所知，主题功能通常按以下方式实现。
-
为每个主题（蔚蓝，宇宙，雪人）创建一个CSS文件。您应该编辑CSS文件，以免彼此冲突。（将.cerulean，.cosmo，.yeti放在所有CSS选择器的前面。如果使用sass或更少，将更容易。）
-
从HTML头加载所有CSS文件。
> > <link rel="stylesheet"
> href="/bootstrap/css/bootstrap_cerulean.min.css">
> <link rel="stylesheet" href="/bootstrap/css/bootstrap_cosmo.min.css">
> <link rel="stylesheet" href="/bootstrap/css/bootstrap_yeti.min.css">
- 如果用户选择主题，则将正文类别或根元素更改为相应的主题名称。
> > <body class="cerulean">
> <body class="cosmo">
> <body class="yeti">
-
我有一个颜色列表，当点击，它改变了文本的颜色，悬停等在网站上。但当您重新加载或转到另一页时,我选择的颜色不会保存。似乎是使用localStorage完成的，但我不明白如何实现它。站点链接：点击
-
问题内容： 所以我有一个包含3个项目的项目： 在的中： 每次单击某个项目时，都会调用一个骨干路由器，该骨干路由器将调用，而后者又将调用一个。 我仍在努力解决基本上存在单向数据流这一事实。而且我习惯直接操作DOM。 我想做的是将类添加到单击的选项卡中，并确保将其从非活动类中删除。 我所知道的CSS技巧，你可以使用属性和不同的造型适用于为属性或。 骨干路由器已经获取了变量并调用正确的页面。我只是不确定
-
问题内容： 我正在尝试做的是拥有三个不同的 _< select>_菜单，这些菜单将全部绑定到同一数据中。更改第一个选择菜单，将更改菜单2和3的数据。 这是我的控制器的内部： 到目前为止，这是我从参考资料中尝试的内容，该参考资料使用了我需要的相同想法： http //codepen.io/adnan-i/pen/gLtap 当我从第 一个 选择菜单中选择“品牌舱口盖”或“银石”时，其他两个菜单的数据
-
问题内容： 我想在CSS之间切换，因此当用户单击按钮（）时，它会显示菜单（）并更改CSS，而当用户再次单击它时，它将恢复正常。到目前为止，这就是我所拥有的： 有人可以帮忙吗？ 问题答案： 对于1.9以下的jQuery版本请参阅https://api.jquery.com/toggle- event 但是，在这种情况下使用类比直接设置CSS更好，请查看提及的addClass和removeClass方
-
我目前正在使用PDFBox，我正在尝试打开PDF，以便用户可以用鼠标选择要裁剪的区域，我不知道如何继续制作PDF查看器 PDPage#setCropBox（PDRectangle cropBox） https://pdfbox.apache.org/docs/2.0.2/javadocs/org/apache/pdfbox/pdmodel/PDPage.html#setCropBox（org.ap
-
本文向大家介绍用CSS实现tab切换相关面试题，主要包含被问及用CSS实现tab切换时的应答技巧和注意事项，需要的朋友参考一下 1.用label结合单选按钮radio接受切换tab的单击 2.用zindex层级来显示当前tab页对应的内容 3.用css兄弟选择器选中对应的tab页签和内容页，添加相应的样式