移至AngularJS上的其他路线时如何保存输入数据？

Question

I have an AngularJS application which is dynamically created.

Because of that, it may have a normal <form> with a submit button, but inside of it there could be a link to another one, and another one and so on.

I've already accomplished to correctly submit the data no matter how deep in this "form-net" the user is, but the problem is that the user might not fill them in the "correct order", and the user is freely to do so.

For example, he/she could start filling FORM A and then realizing that there is FORM B inside of it, move to another route, filling and submitting FORM B and when coming back and FORM A it will be empty.

So, I want to pre-save all input data the user filled. I just want some sort of cache of any input the user might give, so the user can move freely from one form to another without an obligation to submit.

Answer 1

You could try using an Angular service and inject it as a dependency in all the controllers that the forms use. You would then bind the data to this service rather than to the controller. Since the service is a singleton, it will only be created once and will not get recreated as the user moves throughout your app. The data bound values will persist as long as you don't change them and the user stays in the app.

The service could look something like this:

app.service('MyService', function () {
  return {
    form1Data: {},
    form2Data: {},
    form3Data: {}
  };
});

And then bind to the correct formNData field in your view layer. If the number of forms also ends up being dynamic, you can add a configuration block to your Angular app that indicates how many of these form data object you'll need and use that inside the service function.