Используйте $ timeout для ожидания разрешения данных сервиса

0

Я пытаюсь передать данные из директивы в контроллер через службу, моя служба выглядит так:

angular
    .module('App')
    .factory('WizardDataService', WizardDataService);

WizardDataService.$inject = [];

function WizardDataService() {
    var wizardFormData = {};

    var setWizardData = function (newFormData) {
        console.log("wizardFormData: " + JSON.stringify(wizardFormData));
        wizardFormData = newFormData;
    };

    var getWizardData = function () {
        return wizardFormData;
    };

    var resetWizardData = function () {
        //To be called when the data stored needs to be discarded
        wizardFormData = {};
    };

    return {
        setWizardData: setWizardData,
        getWizardData: getWizardData,
        resetWizardData: resetWizardData
    };
}

Но когда я пытаюсь получить данные от контроллера, он не решен (я думаю, что он ждет цикла digest, чтобы закончить). Поэтому мне нужно использовать функцию timeout в моем контроллере, чтобы подождать, пока она не будет закончена, например:

$timeout(function(){
    //any code in here will automatically have an apply run afterwards
    vm.getStoredData = WizardDataService.getWizardData();

    $scope.$watchCollection(function () {
        console.log("getStoredData callback: " + JSON.stringify(vm.getStoredData));
        return vm.getStoredData;
    }, function () {
    });
}, 300);

Несмотря на то, что он работает, меня интересует, если есть лучший способ сделать это, также если это ошибка и главный вопрос, почему мы используем 300 задержек, а не 100 (например) для $ тайм-аут и если он всегда будет работать (возможно, для кого-то потребовалось больше времени, чем 300, чтобы получить данные из службы).

Теги:

2 ответа

0

Используйте angular.copy для замены данных без изменения ссылки на объект.

function WizardDataService() {
    var wizardFormData = {};

    var setWizardData = function (newFormData) {
        console.log("wizardFormData: " + JSON.stringify(wizardFormData));
        angular.copy(newFormData, wizardFormData);
    };

Из Документов:

angular.copy

Создает глубокую копию источника, который должен быть объектом или массивом.

  • Если задан пункт назначения, все его элементы (для массивов) или свойства (для объектов) удаляются, а затем все элементы/свойства из источника копируются на него.

Применение

 angular.copy(source, [destination]);

- Ссылка на API-интерфейс AngularJS angular.copy

Таким образом, ссылка на объект остается неизменной, и все клиенты, у которых есть эта ссылка, будут обновлены. Нет необходимости извлекать новую ссылку на объект при каждом обновлении.

0

Вы можете вернуть обещание с помощью метода получения услуги. Затем в вашем контроллере вы можете предоставить метод успеха для назначения результатов. Ваш сервис будет выглядеть так:

    function getWizardData() {
        var deferred = $q.defer();
        $http.get("/myserver/getWizardData")
            .then(function (results) {
                deferred.resolve(results.data);
            }),
            function () {
                deferred.reject();
            }
        return deferred.promise;
    }

И в своем ng-контроллере вы вызываете свое обслуживание:

wizardService.getWizardData()
     .then(function (results) {
        $scope.myData = results;
     },
     function () { });

Нет необходимости в таймаутах. Если ваш сервер RESTFULL, используйте $ resource и привяжите его напрямую.

  • 0
    Спасибо за ваш ответ, но у меня нет сервера или URL-адреса, я просто добавляю данные (объект) в сервис с помощью метода setWizardData.
  • 0
    Вы можете разместить свой код контроллера? Там должно быть что-то еще происходит ....

Ещё вопросы

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