Angularjs pass value from one page to another

Question

In the following code i am trying to change to another page on click and want to pass the object i how can i do it. In the following code i get it as undefined.how to go about this

<button ng-href="#/page1" value="{{i.display}}"></button>

app.controller("ctrls",['$scope','$location',function($scope,$location){
  $scope.func = function(i) {
    $scope.var=i
    $location.path("/rel");
  };
]);

app.controller("ctrls",'$scope',function($scope)   {
console.log($scope.var) //undefined
]);

Answer 1

Pages normally have controller(s), a service can be created to share data between pages ( by injecting service in associated controllers). Like:

app.factory('myService', function() {
 var savedData = {}
 function set(data) {
   savedData = data;
 }
 function get() {
  return savedData;
 }

 return {
  set: set,
  get: get
 }

});

In your controller A:

myService.set(yourSharedData);

In your controller B:

$scope.desiredLocation = myService.get();

Happy Helping!

Answer 2

Use a service (best) https://docs.angularjs.org/guide/services

Or $rootScope (bad, but simpler) https://docs.angularjs.org/api/ng/service/$rootScope