<!DOCTYPE html>
<html>
<head>
<title>Angular JS Active Route</title>
<script src=
</script>
<script src=
</script>
</head>
<body style="text-align: center">
<h1 style="color: green">GeeksforGeeks</h1>
<h3>How to determine active route in AngularJS ?</h3>
<p>
<a href="#viewLanguages">View Languages</a>
</p>
<p>
<a href="#viewCourses">View Courses</a>
</p>
<div ng-app="mainApp" ng-controller="GFGController">
<div ng-view></div>
<p>{{ message }}</p>
<p>{{ mylocation }}</p>
</div>
<script>
var mainApp = angular.module('mainApp', ['ngRoute']);
mainApp.config([
'$routeProvider',
function ($routeProvider) {
$routeProvider
.when('/viewLanguages', {
template:
'<p> Details of all languages content ' +
'available at GeeksforGeeks </p>',
})
.when('/viewCourses', {
template:
'<p> Details of all courses available at' +
' GeeksforGeeks</p>',
})
.otherwise({
redirectTo: '/viewLanguages',
});
},
]);
mainApp.controller(
'GFGController',
function ($scope, $location, $rootScope) {
$scope.message =
'This page will be used to promote' + ' GeeksforGeeks';
$rootScope.$on('$routeChangeStart', function () {
$scope.mylocation = $location.path();
});
}
);
</script>
</body>
</html>