Как показать спиннер на конкретном элементе, используя директиву angularjs?

Question

В моем приложении есть сетки, созданные с помощью ng-repeat. Я написал директиву, чтобы показывать счетчик всякий раз, когда выполняется http-вызов. Когда http-вызов находится в процессе, спиннер отображается на каждой сетке, а не на конкретной сетке. Я хочу показывать счетчик только на сетке, на которой нажал пользователь.

app.directive('Loading', function ($compile , $http) {
var loadingSpinner = '<i class="fa fa-spinner fa-spin"></i>';
return {
    restrict: 'A',
    link: function (scope, element, attrs) {
        var originalContent = element.html();
        element.html(loadingSpinner);
        scope.isLoading = function () {
          return $http.pendingRequests.length > 0;
        };
        scope.$watch(scope.isLoading, function (val) {              
            if(!val) {
                element.html(originalContent);
                $compile(element.contents())(scope);
            } else {
                element.html(loadingSpinner);
            }
        });
    }
};

Мои сетки выглядят примерно так