AngularJS - сохранение данных между маршрутами

Question

Что было бы лучшим способом сохранить данные между маршрутами?
Итак, у меня есть форма, которая имеет 4 шага, и я хотел бы, чтобы данные предыдущего шага были перенесены на следующий шаг.

Прямо сейчас, я использую «сервис», чтобы сохранить данные, которые работают. Однако проблема заключается в том, что «сервис» является одноэлементным, перемещаясь от формы и возвращаясь к нему, все равно будут иметь все данные из предыдущей неполной или заброшенной формы.

Есть ли хороший способ решить такую ​​ситуацию?

Спасибо,
Tee

Answer 1

Services будет сохраняться на протяжении всей жизни ваших приложений игровая. Поэтому у вас не должно быть никаких проблем. Все, что вам нужно сделать, это создать Service и ввести его в контроллеры, которым необходимо получить к нему доступ. Например, ниже я ввел User сервис для контроллеров.

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

Первый контроллер для первого маршрута,

app.controller("FirstPageController", function($scope,User){ 
    $scope.user = User; 
    $scope.user.firstName = "Emre"; 
    $scope.user.secondName = "Nevayeshirazi"; 
}); 

Второй контроллер для второго маршрута,

app.controller("SecondPageController", function($scope,User){ 
    $scope.user = User; 
    $scope.user.age = 24; 
}); 

Answer 2

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

• Пользователь не заполняет форму и не перемещается от всего процесса отправки формы
• Пользователь отправляет форму

В принципе, вы можете улучшить свой сервис следующим образом:

myApp.factory('myService', function() { 
    var formData = {}; 

    return { 
     getData: function() { 
      //You could also return specific attribute of the form data instead 
      //of the entire data 
      return formData; 
     }, 
     setData: function (newFormData) { 
      //You could also set specific attribute of the form data instead 
      formData = newFormData 
     }, 
     resetData: function() { 
      //To be called when the data stored needs to be discarded 
      formData = {}; 
     } 
    }; 
}); 

Ваш контроллер может затем быть следующим:

myApp.controller('FirstStepCtrl', ['$scope', 'myService', function ($scope, myService) { 
    //This is the controller of the first step in the form 
    //Reset the data to discard the data of the previous form submission 
    myService.resetData(); 

    //Remaining Logic here 
}]); 

myApp.controller('LastStepCtrl', ['$scope', 'myService', function ($scope, myService) { 
    //This is the controller of the last step in the form 

    //Submits the form 
    $scope.submitForm = function() { 
     //Code to submit the form 

     //Reset the data before changing the route - assuming successful submission 
     myService.resetData(); 

     //Change the route 
    }; 

    //Remaining Logic here 
}]); 

Другой альтернативой является вызовите функцию службы resetData(), когда маршрут изменится на то, что не находится в приложении формы. Если у вас есть что-то вроде головного контроллера для формы пошагового управления, то в этом контроллере, вы можете держать следить за изменением маршрута:

$scope.$on('$routeChangeStart', function() { 
    //Use $location.path() to get the current route and check if the route is within the 
    //form application. If it is, then ignore, else call myService.resetData() 

    //This way, the data in the forms is still retained as long as the user is still 
    //filling up the form. The moment the user moves away from the form submission process, 
    //for example, when explicitly navigating away or when submitting the form, 
    //the data is lost and no longer available the next time the form is accessed 
});