Unit-testing Angular services and directives

Being new to Angular (and to tell the truth, JS itself) I'm strugling with isolated unit-testing of services and directives. I tried to compile solution from different examples found in the internet, but failed.

I've got a service:

angular.module('myApp.services', [])
.factory('autoCmpltDataSvc', function ($http) {
    return {
        source: function (request, response) {
            $http({
                method: 'jsonp',
                url: 'http://ws.geonames.org/searchJSON?callback=JSON_CALLBACK',
                params: {
                    featureClass: "P",
                    style: "full",
                    maxRows: 12,
                    name_startsWith: request.term
                }
            }).success(function (data, status) {
                response($.map(data.geonames, function (item) {
                    return {
                        label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
                        value: item.name,
                        geonameId: item.geonameId
                    }
                }));
            });
        }
    }
});

I'd like to fake the interaction with actual web service passing predefined array and check that it returns correct response when passing different values for request.term.

The other task is to unit-test a directive (wrapper around jquery autocomplete)

angular.module('myApp.directives', [])
.directive('autocomplete', function (autoCmpltDataSvc) {
      return {
          restrict: 'E',
          replace: true,
          transclude: true,
          template: '<input id="DstnSlctr" ng-model="autocomplete" type="text"/>',
          link: function (scope, element, attrs) {
              scope.$watch(autoCmpltDataSvc, function () {
                  element.autocomplete({
                      source: autoCmpltDataSvc.source,
                      select: function (event, ui) {
                          scope[attrs.selection] = ui.item.value;
                          scope[attrs.selectionid] = ui.item.geonameId;
                          scope.$apply();
                      }
                  });
              });
          }
      }
  });

I'd like to fake the call to the service with some predefined array and check that the scope is modified correctly.

Is it possible to test those in isolation or should I use only e2e tests for this task?

Thanks in advance for responses! Ksenia