Лучшая практика сохранения состояния формы и прогресса в приложении angularjs?

Я пишу многоэтапный мастер в angularjs. На каждом шаге я хочу сохранить на сервере и перейти к следующему шагу мастера.

Использование простых ссылок для перехода к следующему шагу и сохранения на сервере backend просто и обновляет мое местоположение, сохраняя историю браузера, но этот подход нарушает цель GET быть безопасной и идемпотентной.

Вместо этого я использую этот подход;

$scope.progressToSetp2 = function() {

    $http.put('quote/' + $routeParams.quoteId, $scope.quote)....;

    $scope.OnAfterSubmit = function() {
        $location.path('/steptwo').replace();
        $scope.$apply();
    };

$scope.includeFormPartial = 'partials/steptwo.html';
};

Это хороший подход? Есть ли более эффективные подходы?

Спасибо.

Ответ 1

конечно же есть! почему вы сохраняете сервер на каждом шаге? это не образ мышления angular.

наилучшей практикой является сохранение состояния в области видимости и локальная проверка, и после того, как вы закончите, вы сохраните на заднем конце все шаги при отправке. (локальная проверка не отменяет необходимость проверки в конце)

Если вам нужна еще лучшая практика, используйте службу для хранения данных. Посмотрите

angular.module('myApp', [])
.service('notesService', function () {
    var data = [
        {id:1, title:'Note 1'},
        {id:2, title:'Note 2'},
        {id:3, title:'Note 3'},
        {id:4, title:'Note 4'},
        {id:5, title:'Note 5'},
        {id:6, title:'Note 6'},
        {id:7, title:'Note 7'},
        {id:8, title:'Note 8'}
    ];

    return {
        notes:function () {
            return data;
        },
        addNote:function (noteTitle) {
            var currentIndex = data.length + 1;
            data.push({
                id:currentIndex, title:noteTitle
            });
        },
        deleteNote:function (id) {
            var oldNotes = data;
            data = [];

            angular.forEach(oldNotes, function (note) {
                if (note.id !== id) data.push(note);
            });
        }
    };
})

Если вы заботитесь о вводе пользователя на каждом шаге и хотите сохранить его для него/нее для нескольких сеансов, вы можете временно сохранить входные данные на стороне клиента, пока не закончите все этапы.

также читайте все этот блог

Ответ 2

Лучший подход заключается в том, чтобы разбивать ваш процесс на задачи и сериализовать информацию и сохраняться в базе данных при каждом завершении задачи.

Когда вы закончите последний шаг, вам также не нужно снова повторять все. Вы можете просто вызвать веб-api, который обрабатывает сохраненные шаги в рабочем процессе.

Как вы уже упоминали, это дает пользователю возможность продолжить рабочий процесс позже (умышленно или в случае сбоя системы).

Разрыв рабочего процесса/процесса в задачах также поможет вам понять процесс немного больше. Что является хорошим побочным эффектом такого подхода.