How to set page title in an angular page?

Question

I have created an angular page and module and it does exactly what I wanted it to do. However the page title is CiviCRM and I want to change that. How do I do that?

I have tried to set it in the javascript:

angular.module('myemma').config(function($routeProvider) {
  $routeProvider.when('/my-emma-accounts', {
    controller: 'MyemmaMyEmmaAccounts',
    templateUrl: '~/myemma/MyEmmaAccounts.html',
    title: 'MyEmma accounts',

    // If you need to look up data when opening the page, list it out
    // under "resolve".
    resolve: {
      accounts: function(crmApi) {
        return crmApi('MyEmmaAccount', 'get', {});
      }
    }
  });
});

However the code above does not seem to work.

Answer 1

Short answer: add this to the top of your main angular html template:

<h1 crm-page-title>{{ts('Hello')}}</h1>

More info:

• Documentation can be found in the crmUi code.
• This feature is in 4.7+ (although if you use it in 4.6 it won't crash - it just won't look as good).
• Note the support for setting document title seperately if you wish.