Angularjs keep data on form submit to use in other page

Question

I have a submit function in a controller and I need to keep the data entered in the form to make available it to show in another page of my web (I am using ui-router).

Can anyone please give me a hint about how can do that? How to pass the data from the controller to -don't know what and don't know how- so I can use the data in another page of my web?

Could it be that I have to pass the data from the controller to the routes file as parameters? If so, how can I do it?

Please, notice that I am quite new to Angularjs when explaining.

Thanks!

Here the controller, in case it helps:

(function () {
    "use strict";

    angular.module('public')
    .controller('RegistrationController', RegistrationController);

    RegistrationController.$inject = ['checkDishService','$scope','$stateParams','$http'];

    function RegistrationController(checkDishService, $scope, $stateParams,$http) {
        var reg = this;     

        reg.submit = function () {        
    /*//The form data:
        $scope.reg.user.firstname,
        $scope.reg.user.lastname,
        $scope.reg.user.email,
        $scope.reg.user.phone,
        $scope.reg.user.dish*/

        };//end of submit

    }
})();

use services to transfer the data to another state. – Gaurav Srivastava Aug 02 '17 at 10:13 — Gaurav Srivastava, Aug 02 '17 at 10:13

score 0 · Answer 1 · answered Aug 02 '17 at 10:21

Personally I use a common service to save data through my apps. In your service you can create many properties : user, form1, form2. Then you can get your data by injecting your common service.

Services in Angularjs : https://docs.angularjs.org/guide/services

score 0 · Accepted Answer · answered Aug 02 '17 at 10:28

You can use a factory/service to save temp data of your form. You can create a factory with getter and setter like this:

angular.module('app').factory('tempStorageService',function(){
  var data={};
  return{
    setData:function(tempData){
      data=tempData;
    },
    getData:function(){
      return data;
    }
  }
})

Or you can use $rootScope to add to your values to global scope and access those values across any controller

Angularjs keep data on form submit to use in other page

2 Answers2