Set Page Title In AngularJS

Posted By Weston Ganger

I usually like to set page titles on my angular templates.

var myApp = angular.module('myApp', ['ngResource']);

myApp.config(['$routeProvider', function($routeProvider) {
  $routeProvider.when('/', {
    title: 'Home',
    templateUrl: '/assets/views/home.html',
    controller: 'HomeController'
  });
  $routeProvider.when('/Product/:id', {
    title: 'Product',
    templateUrl: '/assets/views/product.html',
    controller: 'ProductController'
  });
}]);

myApp.run(['$location', '$rootScope', function($location, $rootScope) {
  $rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
    $rootScope.title = current.$$route.title;
  });
}]);