How to get search value from ui-select on change event

I am trying to capture and call a function on the search value of a ui-select element. Specifically, I want to get the value of the ui-select-match element on each keystroke.

In a normal input element, I could do something like this:

// controller
class selectController {
  constructor($scope) {
    this.$scope = $scope;
    this.query = '';
    this.numChars = 0;

  countChars(q) {
    this.query = q;
    this.numChars = q.length;
  }
}

// template
<input ng-model="q" ng-change="ctrl.countChars(q)">...</input>

However, using the angular ui-select, I cannot capture the search input value on the onchange event.

for example:

// controller
class selectController {
  constructor($scope) {
    this.$scope = $scope;
    this.query = '';
    this.numChars = 0;
    this.advisor = {};
    this.advisors = [
      { name: 'Cheryl Aubuchon' },
      { name: 'Jerome Brown' },
      { name: 'John Doe' },
      { name: 'Jane Doe' },
      { name: 'Deborah Grimm' },
      { name: 'Tommy Harris' },
      { name: 'Sally Smith' },
      { name: 'Harry Velez' },
      { name: 'Chelsie Williamson' }
    ];
  }

  countChars(q) {
    this.query = q;
    this.numChars = q.length;
  }
}

// template
<p ng-bind="ctrl.query"></p>

<ui-select ng-model="ctrl.advisor.selected">
    <ui-select-match allow-clear placeholder="Select an Advisor" class="ui-select-match" ng-model="q" ng-change="ctrl.countChars(q)">
        <span ng-bind="$select.selected.name"></span>
    </ui-select-match>
    <ui-select-choices class="ui-select-choices" repeat="advisor in (ctrl.advisors | filter: $select.search)">
        <span ng-bind="advisor.name"></span>
    </ui-select-choices>
</ui-select>

How can I capture the search query as the user is typing it and do something with it in the controller?

I was able to solve the issue by adding refresh and refresh-delay to ui-select-choices

// controller
class selectController {
  constructor($scope) {
    this.$scope = $scope;
    this.query = '';
    this.numChars = 0;
    this.advisor = {};
    this.advisors = [
      { name: 'Cheryl Aubuchon' },
      { name: 'Jerome Brown' },
      { name: 'John Doe' },
      { name: 'Jane Doe' },
      { name: 'Deborah Grimm' },
      { name: 'Tommy Harris' },
      { name: 'Sally Smith' },
      { name: 'Harry Velez' },
      { name: 'Chelsie Williamson' }
    ];
  }

  countChars(q) {
    this.query = q;
    this.numChars = q.length;
  }
}

// template
<p ng-bind="ctrl.query"></p>

<ui-select ng-model="ctrl.advisor.selected">
    <ui-select-match allow-clear placeholder="Select an Advisor" class="ui-select-match">
        <span ng-bind="$select.selected.name"></span>
    </ui-select-match>
    <ui-select-choices class="ui-select-choices" repeat="advisor in (ctrl.advisors | filter: $select.search)" refresh="ctrl.countChars($select.search)" refresh-delay="0">
        <span ng-bind="advisor.name"></span>
    </ui-select-choices>
</ui-select>