How can we redirect to another page with object data using AngularJs

Question

I am trying to redirect my form to another page which is the /customerActivation with the customer object obtained from /getCustomerAccount route. I have searched on online sources and tried many suggestions but none work.

So I want to ask if there is a way to handle this using angular Js? This is my first handling this kind of situation

This is my form which submits or calls the function in my controller

<div ng-controller="CustomerController">
  <h3> Please Enter your customer loyalty card number</h3>
  <form ng-submit="activateAccount()">
       <div class="form-group">
            <input type="text" class="form-control" id="formCard"
                   ng-model="nbcard" placeholder="Card number" required>
       </div>

       <button type="submit" class="btn btn-info btn-lg btn-block btn-trans ">
         Activate my account
       </button>
  </form>
</div>

I have implemented this function in my controller

customerManageAPP = angular.module('customerMngAPP', []);

customerManageAPP.controller('CustomerController',  function($scope, $http) {

    let URL_ACT_ACCOUNT = `http://localhost:${port}/getCustomerAccount`;

    $scope.activateAccount = function() {
        $http.get(URL_ACT_ACCOUNT + `?cardNumber=${$scope.nbcard}`)
            .then(function (response) {
                $scope.customerAccount =  response.data;
                $location.path('/customerActivation/' + $scope.customerAccount.firstname + $scope.customerAccount.lastname);
            });
    };
});

and I have this in my routes file

router.get('/customerActivation', function(req, res) {
    res.setHeader('Content-Type', 'text/html');
    res.sendFile( __dirname + '/views' + '/customerActivation.html');
});

router.get('/getCustomerAccount', async (req, res) => {
    const { cardNumber } = req.query;

    const response = await Customers.find({"nb_card": cardNumber});

    res.json(response);

});

Answer 1

In general one uses a client-side router to parse the url:

With ngRoute :

angular.module("app",["ngRoute"])
.config(function($routeProvider) {
    $routeProvider.when({
        url: "/customerActivation/:customerId",
        templateUrl: "views/customerActivation.html",
        controller: "ActivationController"
    })
})
.controller("ActivationController", function($scope, $routeParams) {
    console.log("customerId", $routeParams.customerId);
})

For more information, see

• AngularJS ngRoute $route Service API Reference - Example