UPDATE: This is an "X Y problem". The way I was trying to do it is answered in this answer to a question that's an exact duplicate. However, my actual goal is best reached using ng-bind rather than reinventing a kludgey fake one-way binding mechanism by hand.
--
In the below code, controller isn't defined in the ready() callback. I didn't really think it would be.
The intent here is for the controller to "raise an event" whenever its title changes (easy), and have the HTML update document.title when that happens. The question is, is there any way for the HTML to get its hands on the controller to do that?
<html
ng-app="foo"
ng-controller="FooController as controller"
>
<head>
<title>Default Title</title>
<script src="http://code.angularjs.org/snapshot/angular.min.js"></script>
<script src="foo.js"></script>
<script type="text/javascript">
angular.element(window.document.body).ready(
function () {
// This does get called
//alert('test');
// controller isn't defined, not too surprisingly.
controller.titleChanged = function (title) {
//alert(title)
document.title = title;
};
});
</script>
</head>
I can set the title like this:
<title>{{controller.title}}</title>
...but then I see {{controller.title}} in my browser history instead of a meaningful title, and as I understand it that's also what a search engine would see.
Of course I can have the controller assign the new title to document.title, and for now that's what I'm doing, but I prefer to keep controllers ignorant of views.
