Get selected value and pass to new page

Question

I'm working on a website using a MEAN stack. I'm trying to get a selected option from a selectbox where the options are stored in my MongoDB. Each of the options also has some other information that is not shown in the selectbox.

What I want to get done is getting the selected option and take this value to another page and show the value plus all other information that belongs to this option, on the other page.

This is my selectbox:

<div class="searchbox" ng-controller="cityCtrl">
  <div class="plumber-by-city col-sm-6">
     <select>
       <option>Zoek loodgieter op plaatsnaam</option>
       <option ng-repeat="x in doc">{{ x.city }}</option>
     </select>
  </div>
</div>

This is how I get the data from MongoDB in Node:

var cityInfoSchema = new Schema ({
  city: String,
  phoneLG: String,
  phoneAV: String,
  phoneCV: String
}, {collection: 'citynames'});

var CityInfo = mongoose.model('CityInfo', cityInfoSchema);

router.get('/getdata', function(req, res, next){
  CityInfo.find()
    .then(function(doc){
    console.log('Data successfully retrieved');
    res.json(doc);
  });
});

And this is how I get the data on the frontend side with Angular:

angular.module('loodgietersApp').controller('cityCtrl',function($scope,$http){
 $scope.doc = [];

 $http.get('/getdata').then(function(d){
   console.log(d);
   $scope.doc = d.data;
 },function(err){
   console.log(err);
 });
});

And this is the page where I want the information of the selected item passed to and showed:

<div class="container plumbers" ng-controller="cityCtrl">
   <p>This is a sample text {{city}}</p>
   <p>This is a sample text {{phoneAV}}</p>
   <p>This is a sample text {{phoneCV}}</p>
</div>