Changing ng-include dynamically

I am very new to Angular. I am trying to dynamically change the ng-include value in my header whenever the user selects the "facebook" page. I cannot figure out why what I have is not working. I tried everything I found on stackoverflow and ended up with these instructions: http://blog.dynamicprogrammer.com/2012/09/19/dynamic-includes-with-angular-js.html

This is my html:

<!-- BEGIN HEADER -->
<div data-ng-include data-ng-src="getPartial()" data-ng-controller="HeaderController"
         class="page-header navbar navbar-fixed-top">
</div>
<!-- END HEADER -->

      

        
        
        
      

    

This is my controller:

* Setup Layout Part - Header */
PicoApp.controller('HeaderController', ['$scope', function ($scope) {
    $scope.$on('$includeContentLoaded', function () {
        Layout.initHeader(); // init header
    });

    $scope.getPartial = function () {

        if (!FacebookPage.currentPage) {
            location.href = "#/";
            return 'tpl/header.html';
        } else {
            location.href = "#/";
            return 'tpl/header_main_page.html';
        }   
      }

}]);