angular : ng-bind from view to position outside view

if this is solvable with $rootScope, how can i achieve this? my code is below, inside the view it works fine, as soon as i place the element outside of the view it breaks.

controller

$http.get('testData.json').success(function(data) {
     angular.forEach(data, function(item) {
            if (item.id == $routeParams.detailId) 
              $scope.article = item;
              $scope.category = $scope.article.category;
          });
      });

populated input from controller

<input type="text" ng-model="category">

ng-bind element outside controller

<h1 ng-bind-template="Hello, {{category}}"></h1>

i tried to load the data in rootScope, whats not worked, furthermore $rootScope window

    .run(function($rootScope, $window) {
    $rootScope.window = $window;
});