An AngularJS directive like ngClass that adds and removes css classes based in the current route path.
<div drpx-class-route="{'home-page' : '/?', 'a-product-page': '/products/[^/]+'">
...
</div>
Add the bower component drpx-components
:
$ bower install --save drpx-components
Add the dependency to your index.html
:
<script src="bower_components/drpx-components/drpxClassRouteDirective.js"></script>
Add the dependency to you YourApp.js
:
angular.module('YourApp', [
// ...your other dependencies...
'drpx.classroute',
]);
Invoke it in your html templates using the directive as attribute and as value an object whose keys are css class names and values string regular expressions:
<ANY drpx-class-route="{'class-name': 'routeStringRegex', ...}"> ... </ANY>