ngAutocomplete - Using a function in the controller when a location has been selected from the list

ngAutocomplete Controller Example

Working example: http://jsfiddle.net/n3ztwucL/

ngAutocomplete.app.js

// ngAutocomplete Directive - https://github.com/wpalahnuk/ngAutocomplete

angular
  .module('app', ['ngAutocomplete'])
  .controller('LocationCtrl', LocationCtrl);

function LocationCtrl($scope) {
  var vm = this;

  vm.location = '';
  vm.location_list = [];
  vm.location_result = null; // this is the model we need to use

  // autocomplete options
  vm.autocomplete_options = {
    types: 'establishment'
  };

  // look for a change in the location and do something
  // its a little confusing because we're not watching the ng-model from this controller
  // but rather the model that gets set from the ngAutocomplete directive
  $scope.$watch(function() {
    return vm.location_result;
  }, function(location) {
    if (location) {
      vm.location_list.push(location);
      vm.location = '';
    }
  });

}

ngAutocomplete_app.html

<div ng-app="app" ng-controller="LocationCtrl as ctrl">
  <input type="text"
    ng-autocomplete
    options="calendar_ctrl.autocomplete_options"
    ng-model="ctrl.location"
    details="ctrl.location_result">
    <hr>
    <button ng-if="ctrl.location_list.length" ng-click="ctrl.location_list = []">&times;</button>
    <h4>Locations </h4>
    <ul>
      <li ng-repeat="location in ctrl.location_list track by $index">{{location.name}}</li>
    </ul>
</div>