Answer the question
In order to leave comments, you need to log in
How can I assign a specific class depending on the page?
How do I assign a class to the body tag depending on which page I'm on. For example page /mainPage
body assign class mainPage
app.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/main', {
templateUrl: 'mainPage.html',
controller: 'MainPage',
}).
when('/powerSky', {
templateUrl: 'template/powerSky.html',
controller: 'PowerSky'
}).
otherwise({
redirectTo: '/main'
});
}]);
Answer the question
In order to leave comments, you need to log in
In the first comment, everything was right and succinctly said - through $rootScope - I'll just chew it.
The ngRoute module is just a regular config - you can shove whatever you want into this config. Give each page a unique ID or page category name:
app.config(['$routeProvider',
function($routeProvider) {
$routeProvider.
when('/main', {
id: 'main',
title: 'Главная',
category: 'rootPage',
templateUrl: 'mainPage.html',
controller: 'MainPage',
}).
when('/powerSky', {
id: 'powersky',
title: 'Всем повер-скай, посоны',
category: 'contentPage',
templateUrl: 'template/powerSky.html',
controller: 'PowerSky'
}).
otherwise({
redirectTo: '/main'
});
}]);
app.controller('MainController', function($rootScope) {
$rootScope.$on('$routeChangeSuccess', function(e, current, previous) {
var page = current.$$route;
// присваиваем глобально
$rootScope.page = page;
});
});
<!DOCTYPE html>
<html ng-app="app">
<head>
<title>{{page.title}}</title>
</head>
<body ng-class="page.id" ng-controller="MainController">
<main ng-view></main>
</body>
</html>
<!DOCTYPE html>
<html ng-app="app">
<head>
<title>{{page.title}}</title>
</head>
<body ng-class="page.category" ng-controller="MainController">
<main ng-view></main>
</body>
</html>
body {
&.rootPage {
background-color: #fff;
}
&.contentPage {
background-color: #ddd;
}
}
I would suggest doing this through a directive (the code is old, it should be updated):
https://gist.github.com/fesor/226fce4a4aee5fb30454
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question