How to watch a deferred service property?

If I have the following simple controller & service.

<div ng-controller="MessagesCtrl">
  <ul>
    <li ng-repeat="message in data.messages">
      {{ message }}
    </li>
  </ul>
</div>

myApp.factory('Data', function () {
  var _messages = [];
  return {
    messages: _messages,
    getMessages: function() {
      $http.get('/messages').then(function(response) {
        _messages = response.data;
      });
    }
  };
});

function MessagesCtrl($scope, Data) {
  $scope.data = Data;
  $scope.data.getMessages();
}

I would expect the messages model to auto-update when the AJAX request completes and fills the object, however it does not. How is this supposed to work? (I'm sort of asking what the best practice is for this structure).

Edit - working solution:

<div ng-controller="MessagesCtrl">
  <ul>
    <li ng-repeat="message in data.messages">
      {{ message }}
    </li>
  </ul>
</div>

myApp.factory('Data', function () {
  return {       
    getMessages: function() {
      var _this = this;
      $http.get('/messages').then(function(response) {
        _this.messages = response.data;
      });
    }
  };
});

function MessagesCtrl($scope, Data) {
  $scope.data = Data;
  $scope.data.getMessages();
}