How to update the title and description from the respective controller dynamically?

Question

AngularJS update Meta title description from controller dynamically

app.config(
            function($routeProvider, $locationProvider, ngMetaProvider){
                $routeProvider.
                    when('/',{
                        templateUrl:'js/partials/s1.html',
                        controller:'HomeController',

                        meta: {
                          title: 'title1',
                          description: 'description12'
                        } 
                    }).
                    when('/:id/:id', {
                        templateUrl: 'js/partials/site2.html',
                        controller: 'SinglePostController',

                        meta: {
                          title: 'title2',
                          description: 'description2'
                        } 
                    }).
                    otherwise({
                        redirectTo:'/',
                        controller:'HomeController', 
                        templateUrl:'js/partials/home.html'
                    });
                    $locationProvider.html5Mode(true);//.hashPrefix('!');

        });

the above code is my config, i want to update the

meta: {
    title: 'title2',
    description: 'descrtion2'
 }

how to update the title and description from the respective controller, any help

Many examples here: http://stackoverflow.com/questions/12506329/how-to-dynamically-change-header-based-on-angularjs-partial-view — shammelburg, May 17 '16 at 15:37

score 0 · Answer 1 · answered May 17 '16 at 15:34

define a controller for head tag. in that controller:

app.controller('headController', ['$scope', '$route', function ($scope, $route) {

    $scope.$on('$routeChangeSuccess', function (scope, next, current) {
                $scope.title = $route.current.meta.title;
                $scope.description = $route.current.meta.description;
            });
}]);

and in the head section of your page simply write

<meta name="description" content="{{description}}" />

How to update the title and description from the respective controller dynamically?

1 Answers1