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 に答える