Javascript scope error when accessing from callback

Below is part of code from angularjs service. It may not a specific question to angular though.

The $http.get('/api/test/1').then ( ... returns promise and I like to process the data returned by the call back. I am getting error when accessing filter method.

Test.filter(data.Root);


TypeError: Object #<Object> has no method 'filter'

But, I could access the data variable in the same scope (previous line) though.

var testApp = angular.module('testApp.services', []);
testApp.factory('Test', function ($http, $rootScope) {
    var Test = {};
    var data = [];

    Test.filter = function (d) {
        ret = data.filter(function (el) {
            return el.Pid == d.Id;
        });
        return ret;
    };
    Test.data = function () {
        return data[1];
    };

    Test.start = function () {
        Test.asyncData = $http.get('/api/test/1')
            .then(function (response) {
                data = response;
                return Test.filter(data.Root);
            }, function (response) {
                Test.error = 'Can\'t get data';
                data = 'Error: ' + response.data;
                return data;
            });
    };

    return Test;
});