Question

我正在angularjs中编写一个多步向导。在每一步中，我希望保存到服务器，然后进入向导中的下一步。

使用简单的链接进入下一步并保存到后端服务器很简单，它会更新我的位置，维护浏览器历史记录，但这种方法违反了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';
};

这是一个好方法吗？有更好的方法吗？

感谢。

Answer 1

当然有！为什么要在每一步中保存到服务器？它不是有棱有角的思维方式。

最佳做法是将状态保存在范围内并进行本地验证，并在完成后将保存到后端的整个步骤保存在发送中。（本地验证不会取消后端验证的需要）

如果您想要更好的练习，请使用服务来保存数据。看this

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);
            });
        }
    };
})

如果您关心每个步骤中的用户输入并希望为他/她保留多个会话，您可以暂时将输入数据保存在客户端，直到完成所有步骤。

还阅读了所有this博客

Answer 2

更好的方法是将您的流程分解为任务并序列化信息，并在每次任务完成时将其保留到数据库中。

当您完成最后一步时，您也不必重新提交所有内容。您只需调用web api即可处理工作流中的持久步骤。

与您所提及的一样，这使用户能够在以后继续工作（有意或在系统出现故障的情况下）。

将工作流程/流程分解为任务也可以帮助您更好地理解流程。这种方法的副作用很好。

保存angularjs应用程序中的表单状态和进度的最佳实践？

2 个答案: