11

我正在用 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';
};

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

谢谢。

4

2 回答 2

10

当然有!为什么在每一步都保存到服务器?这不是角度的思维方式。

最佳实践是将状态保存在范围内并进行本地验证,完成后将整个步骤保存到后端发送。(本地验证不取消后端验证的需要)

如果您想要更好的实践,请使用服务来保存数据。看看这个

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

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

还阅读了所有 这个博客

于 2012-10-30T14:02:01.020 回答
1

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

完成最后一步后,您也不必再次重新提交所有内容。您可以只调用处理工作流中持久步骤的 Web api。

就像您提到的那样,这使用户能够稍后继续工作流程(有意或在系统故障的情况下)。

将工作流/流程分解为任务也将帮助您更多地了解流程。这是这种方法的一个很好的副作用。

于 2017-04-13T06:26:21.033 回答