2016-07-21 11 views
0

Ich erstelle eine App, wo einige Teile/Elemente aus der Anwendung ausgeblendet werden, diese Teile je nach Art des Benutzers angezeigt werden oder nicht. Eines der Elemente ist der Header-Bereich. Dazu habe ich einen Dienst erstellt, in dem ich das Benutzerinformationskonto hinterlege, und dann habe ich in einen Controller injiziert, in meinem Fall habe ich in den headerController injiziert. Im Inneren des headerController erstelle ich eine Variable:NgIF mit Service ist langsam

vm.isProfessional = null; 

als ich den Service anrufen:

ProfileService.isType("professional").then(
       function (result) { 
        vm.isProfessional = result; 

       } 
      ); 

Nach meiner Ansicht header.php I enthalten:

<div ng-if="headerCtrl.isProfessional" > 
... 
</div> 

funktioniert, aber die nur problem dauert einige zeit, nach dem laden der seite, das header-element braucht einige zeit, bis es das element zeigt, und visuell ist es nicht ansprechend, gibt es eine möglichkeit, es schneller zu machen, die variable vm.isProfession Al erhält schneller den booleschen Wert, um nicht so viel Zeit zu nehmen? Ich glaube, dass das, was diese Einnahme so lange in Anspruch nimmt, im Dienst liegt, der ein Versprechen ablegt, aber ich glaube, dass ich diesbezüglich nicht viel tun kann.

Oben verlasse ich auch meinen Dienst. Service:

(function() { 
    'use strict'; 

    angular 
     .module('myApp') 
     .factory('ProfileService', ProfileService); 

    ProfileService.$inject = ['$http','UserService','$q']; 

    /* @ngInject */ 
    function ProfileService($http, UserService,$q) { 


     var service = { 
      isType:   isType 
     }; 
     return service; 


     function isType(accountName) { 
      var deferred = $q.defer(); 
      UserService.getAuthenticatedUser() 
       .then(function (response) { 
        var data = response.data; 
        UserService.getUserInformation(data.user.id) 
         .then(function (response) { 
          var userDetails = response.data; 
          deferred.resolve(accountName == userDetails.account_types[0].description_internal); 
          return; 
         }); 
       }); 

      return deferred.promise; 
     } 


    } 

})(); 
+0

Hallo Marco Es ist die Idee, die hinter REST in AngularJS aufruft, die sie verspricht verwenden, also nichts einzuwenden. Wäre es möglich, die Anzahl der Aufrufe von Diensten zu reduzieren, sodass Sie die userInformation im selben Aufruf wie authenticatedUser erhalten? Es würde Ihnen leichter helfen, wenn Sie den gesamten Code zu JSfiddle oder ähnlichem bringen könnten. Wird das möglich sein? – mooonli

Antwort

1

statt ng-wenn, Verwendung ng-Show oder ng-hide.

Mit ng-if wird der gesamte Inhalt innerhalb Ihres div nicht verarbeitet (existiert nicht in DOM) als headerCtrl.isProfessional ist false. Und es wird nicht verarbeitet, bis die isType-Zusage zurückkehrt und headerCtrl.isProfessional auf true setzt.

Mit ng-show oder ng-hide würde der Inhalt des div verarbeitet werden, notwendige Bindungen würden erstellt werden. Und sobald der Dienst zurückkehrt, es würde lediglich den Wert der Anzeige Eigenschaft sichtbar Flip oder versteckt sehen https://docs.angularjs.org/api/ng/directive/ngShow