我正在尝试使用 AngularJS 控制器加载特定的 CSS 文件。
HTML代码看起来像
<html lang="en" ng-app="CPCplusLunchLink" ng-controller="mainController">
<head>
<meta charset="UTF-8">
<script src="js/lib/angularjs/angular.min.js"></script>
<script src="js/lib/angularjs/angular-route.min.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers/main.js"></script>
<script src="js/controllers/events.js"></script>
<script src="js/services/events.js"></script>
<link rel="stylesheet" ng-href="css/{{ css }}.css">
app.js 相关部分
.when('/', {
templateUrl: 'views/home.html',
controller: 'EventsController'
})
主控制器
myApp.controller('mainController', ['$scope', function($scope){
// set the default css
$scope.css = 'style';
}]);
和我为 CSS 设置值的控制器
myApp.controller('EventsController', ['$scope','events','$rootScope', function($scope, events, $rootScope){
// set dedicated CSS
$rootScope.css = 'style2';
events.then(function(data) {
$scope.eventsList = data.evets;
console.log($scope.eventsList);
});
}]);
但我无法根据加载的控制器更改默认 CSS 值。
任何线索我错过了什么?
您必须让 angular 知道控制器内部定义的动态 CSS 变量。所以你必须在 HTML 标签上定义控制器
<html lang="en" ng-app="myApp" ng-controller="EventsController">
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句