angularjs - AngularJS、トランスクルードでスピナーディレクティブをロードしていますか?

Question

$http リクエスト実行時にスピナーを表示するディレクティブを作りたいです。

これは機能すると思いました（例：ユーザーのロード）：

メインコントローラー

app.controller('UserListController', function($scope, $http) {

    $scope.users = [];
    $scope.loading = true;

    $http.get('/users').then(function(response) {
        $scope.users = response.data;
    }).finally(function() { $scope.loading = false; });

});

ディレクティブを使用したテンプレート

<div request-loading="loading">
    <ul>
       <li ng-repeat="user in users">{{ user.name }}</li>
    </ul>
</div>

request-loading-directive.js

app.directive('requestLoading', function() {
    return {
        scope: {
           requestLoading: '='
        },

        transclude: true, // I think this is not Ok

        templateUrl: 'request-loading-directive.html'
    };
});

request-loading-template.html

<div ng-show="requestLoading" class="super-cool-spinner">
    Loading text with the spinner...
</div>

// This is what is not working
// I thought the content of the users (ul and li) would be render in this div
// when the request is Ok.
<div ng-transclude ng-show="! requestLoading"></div>

どんな助けでもいいです！どうも。