AngularJS Google Dynamic Title Not Showing On Home Page Only

Question

I have developed the front end of my website ScoreUpdates.com with AngularJs using Angular-Ui for routing. The page title meta tag is changed dynamically using a $rootScope variable and looks like this:

ScoreUpdates.com - {{meta_title}}

If you do a google search for my site google renders the title of every indexed page correctly apart from the homepage which remains as above.

Using google webmaster tools "Fetch as google" also renders the ajax content correctly for the homepage, just not the title.

Answer 1

For anyone finding this question now, the best solution I have come up with at the moment which works (at least on google) is as follows:

When using ui-router if you use Resolve to set the variables - this will happen before the $stateChangeSuccess event fired. Something like:

resolve: {
      data: function($rootScope) {
        $rootScope.meta_title = "My dynamic title" ...