Angular render view after parameter changed in service

High level

I header view and a main view in my angular application. I want the header to have a "back" button that is show/hidden based on the page I'm on.

What I did

app.js (snippet)

app.factory('globalServices', function() {
    return {
        showBack : false,
        back: function() {
            window.history.back();
        }
    };
});

header.html (snippet)

<a class="button-prev" ng-click="back()" ng-show="showBackButton">
    Back
</a>

headerCtrl.js (snippet)

$scope.showBackButton = globalServices.showBack;
$scope.back = function() {
    globalServices.back();
};

subPageCtrl.js (snippet)

globalServices.showBack = true;

Problem

The button viability isn't refreshed after the value is changed. I only see the value changed after I move one more page.

Is there a way to fix it?

I'm also open for a different approach.