Ionic typeahead with ionic-filter-bar - cannot reference $scope

I am trying to implement ionic-filter-bar in order to get typeahead working on my ionic mobile application and having problems trying to determine the $scope within my controller. I have been duplicating most of the code from the demo app found here:

https://github.com/djett41/ionic-filter-bar/blob/master/demo/app/scripts/app.js

I can determine the $scope.hops in order to display all the objects correctly within ng-repeat that renders correctly on the page (without search) but I cannot reference the $scope.hops within the showFilterBar function. I receive undefined when outputting to console.log (see comments in the code). I assume this has something to do with the way that $scope can be accessed in other functions (??) but am stuck.

Can anyone please give me a hand? Thanks in advance.

Controller

//Added $ionicFilterBar & $timeout - Remove if does not work
.controller("hopsListCtrl", function($scope, hopsService, $stateParams, $state, $ionicFilterBar, $timeout) {

    hopsService.getHops().then(function(hops) {

        //This correctly returns my object of hop varieties
        $scope.hops = hops;


    })


    $scope.onSelectHopsDetail = function(hops_detail) {

        $state.go('tab.hopsDetail', hops_detail);

        hopsService.postHopDetails(hops_detail);



    };

    var filterBarInstance;

    //This returns "undefined" -
    console.log($scope.hops);

    $scope.showFilterBar = function() {
        filterBarInstance = $ionicFilterBar.show({

            hops: $scope.hops,
            update: function(filteredItems) {
                $scope.hops = filteredItems;

                //This returns "undefined"
                console.log(filteredItems);
            },
            filterProperties: 'Name'
        });
    };

    $scope.refreshItems = function() {
        if (filterBarInstance) {
            filterBarInstance();
            filterBarInstance = null;
        }

        $timeout(function() {
            getItems();
            $scope.$broadcast('scroll.refreshComplete');
        }, 1000);
    };


})

Hops Listing Page

<ion-view title="Hops Guide">
    <ion-nav-buttons side="secondary">
        <button class="button-icon icon ion-ios-search" ng-click="showFilterBar()">
        </button>
    </ion-nav-buttons>

    <ion-content direction="y" scrollbar-y="false">

        <ion-refresher pulling-icon="ion-arrow-down-b" on-refresh="refreshItems()">
        </ion-refresher>

        <ion-list>
            <ion-item collection-repeat="hop in hops">
                <a class="" ng-click="onSelectHopsDetail(hop)">
                    <p>{{hop.Name}}</p>
            </ion-item>
        </ion-list>

        <div ng-if="hops !== undefined && !hops.length" class="no-results">
            <p>No Results</p>
        </div>

    </ion-content>
</ion-view>