title: Dynamic page titles on AngularJS app
body: <p>We are building a big AngularJS/NodeJS app and we came across a problem. It has to do with the page titles. On our app, we want to have dynamic pages titles for each state (we are using ui-router). I know that we can add custom fields to any state (like pageTitle):</p>
  
  <pre><code>.state('app.home', {
      url: "",
      templateUrl: '/templates/home.html',
      controller: 'HomeController',
      pageTitle: "Home"
  })
  </code></pre>
  
  <p>and then we could retrieve that on <code>$stateChangeSuccess</code> and set it to the <code>$scope</code></p>
  
  <pre><code>.run([
      '$rootScope', function ($rootScope) {
        'use strict';
  
        $rootScope.appState = $rootScope.appState || {};
  
        $rootScope.$on("$stateChangeSuccess", function (event, toState, toParams, fromState, fromParams) {
  
        //TODO: We need to update the title and meta here, and then retrieve it and assign it to appState
        $rootScope.appState.pageTitle = toState.pageTitle;
  
  });
  
  }]);
  </code></pre>
  
  <p>, and then on our index.html do:</p>
  
  <pre><code>&lt;title ng-bind="appState.pageTitle"&gt;Page Title before the dynamic title kicks in&lt;/title&gt;
  </code></pre>
  
  <p>However, in our case, the page title has to come form the DB, via calling our Node.js REST API. For example, imagine, you go on a product page, you have to get the product, to get the title of the product to set the page title. Any ideas how we could do that? </p>
  
  <p>Cheers,<br>
  Iraklis</p>