title: Passing id from one page to another in angularjs
body: <p>I want to take id from list.html page and use the same id to display the details on the list-detail.html page.I just started using angularjs.I am not able to display the details based on id. This is my code:
      index.html</p>
  
  <pre><code>    &lt;body ng-app="myAppnew"&gt;
          &lt;h1&gt;Friends&lt;/h1&gt;
          &lt;section ui-view&gt;&lt;/section&gt;
        &lt;/body&gt;
  </code></pre>
  
  <p>list.html</p>
  
  <pre><code>&lt;ol&gt;
    &lt;ul ng-repeat="friend in friends"&gt;
     &lt;a ui-sref="listDetail({Id: friend.id})"&gt;{{friend.name}}&lt;/a&gt;
    &lt;/ul&gt;
  &lt;/ol&gt;
  </code></pre>
  
  <p>list-detail.html</p>
  
  <pre><code>&lt;h1&gt;Friend Detail&lt;/h1&gt;
  {{id}}&lt;br /&gt;
  {{name}}&lt;br /&gt;
  {{imageLocation}}&lt;br /&gt;
  </code></pre>
  
  <p>app.js</p>
  
  <pre><code>var myApp = angular.module('myAppnew', ['ui.router']);
  myApp.config(function($stateProvider, $urlRouterProvider) {
    $urlRouterProvider.otherwise('/');
    $stateProvider
      .state('list', {
        url: '/',
        templateUrl: 'list.html',
        controller: 'mainCtrl'
      })
      .state('listDetail', {
        url: '/:Id',
        templateUrl: 'list-detail.html',
        controller: 'mainCtrl'
      });
  });
  
  myApp.controller('mainCtrl', function($scope, $stateParams,$http) {
    console.log(arguments);
      $http.get("http://www.fashto.in/rest/getmaincategories").then(function (response) 
                                                             {
           $scope.friends = response.data;
                });
  
  
    function findFriend(id){
      var targetFriend = null;
      $scope.friends.forEach(function(friend){
        console.log("Test",friend.id,id,friend.id === id)
        if (friend.id === id) targetFriend = friend;
      }); 
      return targetFriend;
    }
  
  
    function list($scope, $stateParams) {
      var friend = findFriend(parseInt($stateParams.Id));
  
      angular.extend($scope, friend);
    }
  
    if ($stateParams.Id) {
      list($scope, $stateParams,$http);
      console.log($scope);
    }
  });
  </code></pre>
  
  <p>Thank you in advance.</p>