NgIF с сервисом работает медленно

0

Я создаю приложение, в котором некоторые части/элементы из приложения будут скрыты, эти части в зависимости от типа пользователя будут показаны или нет. Одним из элементов является раздел заголовка. Для этого я создал службу, в которой храню учетную запись пользовательской информации, а затем я ввел ее в контроллер, в моем случае я ввел в headerController. Внутри headerController создаю переменную:

vm.isProfessional = null;

Чем я называю услугу:

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

                }
            );

После моего просмотра header.php я включил:

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

Работает, но единственная проблема занимает некоторое время после загрузки страницы, элемент заголовка занимает некоторое время, пока не покажет элемент, и визуально это не привлекательно, есть ли способ сделать это быстрее, переменная vm.ISProfessional получает быстрее логическое значение, чтобы не занимать столько времени? Я верю, что это заставляет так долго заниматься службой, которая дает обещание, но я считаю, что в отношении этого я не могу многое сделать.

Выше я тоже оставляю свое служение. Обслуживание:

(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
    Привет, Марко. Идея REST-вызовов в AngularJS заключается в том, что они используют обещания, так что в этом нет ничего плохого. Можно ли уменьшить количество вызовов сервисов, чтобы вы получали userInformation в том же вызове, что и authenticatedUser? Было бы легче помочь вам, если бы вы могли поместить весь код в JSfiddle или что-то подобное. Это будет возможно?
Теги:
angularjs-scope

1 ответ

1
Лучший ответ

вместо ng-if, используйте ng-show или ng-hide.

С ng-if весь контент внутри вашего div не обрабатывается (не существует в DOM), поскольку headerCtrl.isProfessional является false. И это не будет обработано до тех пор, пока не будет получено обещание isType, и установите для параметра headerCtrl.isProfessional значение true.

С ng-show или ng-hide содержимое div будет обработано, будут созданы необходимые привязки. И как только служба вернется, она просто изменит значение свойства отображения на видимое или скрытое. Https://docs.angularjs.org/api/ng/directive/ngShow

Ещё вопросы

Сообщество Overcoder
Наверх
Меню