Aktualisierung der Richtlinientabelle bei Aktualisierung der Bereichseigenschaften

Question

Ich habe eine Komponente, die ich erstellen möchte, akzeptiert eine user_id und lädt dann Benutzerinformationen dafür im Hintergrund und lässt dann ein Element auf der Seite mit einer anderen Anweisung daran hängen.

Bisher ist dies, was ich habe

<user-popover user-id="item.item_high_bid_user_id"></user-popover> 

angular.module('bidrAdminApp') 
    .directive('userPopover', ['Data', function (Data) { 
    return { 
     template: '<a bb-popover-template="user-popover-content.html">{{user.user_name}}</a><i ng-hide="{{user}}" class="fa fa-spinner fa-spin" aria-hidden="true"></i>', 
     scope: { 
     userId: '=', 
     user: '=*' 
     }, 
     restrict: 'E', 
     controller: function($scope, $element, $attrs, Data){ 
     Data.getUser($scope.userId).then(function(userData){ 
      $scope.user = userData.data; 
     }); 
     }, 
    }; 
    }]); 

Ich bin Laden von Daten von meinem Data Service und die user.user_name in der Vorlage im Hintergrund immer korrekt aktualisiert wird, ist die Frage der Spinner nicht versteckt wenn die $scope.user aktualisiert wird. Wie kann ich den Spinner ausblenden, nachdem die Benutzerdaten geladen wurden und der Rest der Vorlage aktualisiert wurde?

UPDATE

Ich brauche hier, dass diese Richtlinien in einer wiederkehrenden Raster von Veröffentlichungen bis zu erwähnen, ist diese Anweisung wie eine Art Benutzer schweben Karte, auf Facebook ähnliche wirken soll, wenn man über jemanden schweben und Sie erhalten ein Popover mit einigen Informationen über den Benutzer, also würde ich wirklich gerne jede Iteration dieser Direktive in der Lage sein, eigenständig zu stehen, da die Ladeanzeige jetzt verschwindet, nachdem alle Direktiven ihre $scope.user Eigenschaft geladen haben.

Answer 1

Sie könnten versuchen:

ng-hide="user.user_name.length > 0" 

Answer 2

einfach den Anwendungsbereich von Ihrer Richtlinie entfernen und $attrs.userId

angular.module('bidrAdminApp') 
    .directive('userPopover', ['Data', function (Data) { 
    return { 
     template: '<a bb-popover-template="user-popover-content.html">{{user.user_name}}</a><i ng-hide="{{user}}" class="fa fa-spinner fa-spin" aria-hidden="true"></i>', 
     restrict: 'E', 
     controller: function($scope, $element, $attrs, Data){ 
     Data.getUser($attrs.userId).then(function(userData){ 
      $scope.user = userData.data; 
     }); 
     }, 
    }; 
    }]);