Q:

how to reset current form in a mutil step forms using a service to preserve data

I created a multistep form using ng switch and 3 forms , in order to preserve the data over the forms I created one service using factory method.But I'm trying to create a reset button and I want to clear the data in all fields in current displayed form keeping the data in other forms which should be reflected in model created by factory.I tried to use setpristine over the form but model is not getting updated .
please help and check below js bin link
http://jsbin.com/raxorewuma/edit?html,css,js,output
  angular.module('bankAppOnline', [])
                          .controller('CustomerCtrl', function ($scope) {
                            $scope.step = 1;

                            $scope.advance = function () {
                              $scope.step++;
                            }
                             $scope.previous = function () {

                              $scope.step--;
                            }

                          })
                          .controller('firstformCtrl', function ($scope, Customer) {
                            $scope.customer = Customer.get();
                          $scope.reset = function() {

                                $scope.firstform.$setPristine();
                                //$scope.customer = Customer.get();
                            }  
                          })
                          .controller('secondformCtrl', function ($scope, Customer) {
                            $scope.customer = Customer.get();
                            console.log( $scope.customer );
                          })
                            .controller('thirdformCtrl', function ($scope, Customer) {
                            $scope.customer = Customer.get();
                            console.log( $scope.customer );
                          })
                          .factory('Customer', function () {
                            var customer = {
                              firstname: "",
                              lastname: "",
                              age:"",
                              city:"",
                              profession:"",    
                              mobile:"" ,
                             pan:"",
                             income:"", 
                             company:"",
                             designation:"",
                             profession:"",
                             address:"",
                             pin:"",
                             accountType:"" ,
                             fdCheck:"",
                             creditCardCheck:""
                            };

                            return {
                              get: function () {
                                return customer;
                              }
                            }
                          })

                          .controller('DebugCtrl', function ($scope, Customer) {
                            $scope.customer = Customer.get();
                          });// Empty JS for your own code to be here

A:

The $setPristine function clears the dirty class from the input element only. It does not reset the data. To do that, you must explicitly reset each data element in the form that corresponds to the data in the customer model, see my code for an example:
Option 1 (transparent approach):
  .controller('firstformCtrl', function ($scope, Customer) {
    $scope.customer = Customer.get();
    $scope.reset = function() {
        $scope.firstform.$setPristine();

        // The elements to reset for the first form. 
        // You'll have to do this foreach controller's reset function.
        var restore = {
            "firstname": "",
            "lastname": "",
            "age": "",
            "city": "",
            "profession": "",
            "mobile": ""
        };
        angular.extend($scope.customer, restore);

    };  
  })

Option 2 (encapulation):
.factory('Customer', function () {
    var customer = {
        firstname: "",
        lastname: "",
        age:"",
        city:"",
        profession:"",    
        mobile:"" ,
        pan:"",
        income:"", 
        company:"",
        designation:"",
        profession:"",
        address:"",
        pin:"",
        accountType:"" ,
        fdCheck:"",
        creditCardCheck:""
    };

    return {
        get: function () {
            return customer;
        },

        reset: function(keys){
            angular.forEach(keys, function(val) {
                customer[val] = ""
            });
        }
    };
})

Now replace the reset function with the following for the first form. Each additional form will call  the Customer.reset function with the appropriate array of keys as the argument.
$scope.reset = function() {
    $scope.firstform.$setPristine();

    // The elements to reset for the first form. 
    // You'll have to do this foreach controller's reset function.
    var valsToReset = [
        "firstname",
        "lastname",
        "age",
        "city",
        "profession",
        "mobile"
    ];
    Customer.reset(valsToReset);
}; 

