not able to read data from json using angular services

I know this has been answered around my question many times but still i did not get exactly what I want. I read others answers.

what I am trying to do is read data from the json file using angular service and then send the data to be played by with my controller.

my Service looks like this :

angular.module("app",['ngRoute','ngAnimate', 'ngSanitize', 'ui.bootstrap'])
    .factory('webtest', function($q, $timeout, $http) {
        var Webtest = {
            fetch: function(callback) {
                return $timeout(function() {
                    return $http.get('docs/cats.json').then(function(response) {
                    return response.data;
                });
            }, 30);
        }
    };

    return Webtest;
});

My controller looks like this:

(function () {
'use strict';

angular
    .module('app')
    .controller('catController', Controller);


function Controller($scope,webtest) {

 webtest.fetch().then(function(data) {
        console.log(data);     <---------Correct value
        $scope.cats = data

    });
 console.log($scope.cats) . <----------------Empty array
 }


})();

My problem is that both the console log shows different values. data shows all the json values exactly what i want. but #scope.cats show me empty array.

can you help me !Please