Dynamize title with Angularjs

Question

I want to dynamize my title page with Angularjs. It is currently static:

<title>Workspace</title>

I wonder how I can change that name, based on what’s written on database. Currently in a place where the client will make the modification (input) is like this:

<input type="text" ng-model="workspace.titlePage" id="inputPageTitle" placeholder="Define here the title of the page" class="ng-valid ng-dirty">

However, this happens on another page (workspace-admin.html), there is managing to add in the database and see the information in {{workspace.titlePage}}. I would like the same information, but on another page (index.html).

But when I do {{workspace.titlePage}}, he returns me undefined, since until now the directive responsible for this value has not been loaded.

How can I take that amount?

Answer 1

You can create an event on $rootScope on the page workspace-admin.html and subscribe to this event on index.html:

That is, in the controller of workspace-admin.html:

// emissao do evento
$rootscope.$emit("titlechanged@workspaceadmin", titulo);

And then on controller of index.html:

this.tituloPagina = "PlaceHolder";

// escuta do evento
var eventHolder = $rootScope.$on("titlechanged@workspaceadmin", function(titulo){
    this.tituloPagina = titulo.
});

Finally in index.html:

<title>{{tituloPagina}}</title>