Accessing nested urls when using for loop to generate the list items on feed tab

Note: I am using ionic framework and angular.

Short explanation: I have a json file with information. Each object from the file has an id, category, title, etc. Using a for loop I am filling the feed tab with every object as an item, like a quick post, with an option to click to read more. The for loop is used because of an infinite-scrolling.

Problem: Now when I am using the infinite-scrolling and the for loop everything messed up and the link to the nested page with all the info about every object from the json file doesn't work. In order to take the full info about an item I am using it's id.

GOAL
I want to be able when on the feed tab to click on an item and see the nested page with all the info about it.

EDIT Here is a link (demo) in the plunker. http://embed.plnkr.co/66hgiIxNGTXOuVZgqKvZ/preview

I'll post the main code here in the post too, in case it catches someone's eye / APP.JS

var starter = angular.module('starter', ['ionic'])

starter.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {

    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})


starter.config(function($stateProvider, $urlRouterProvider) {
  $stateProvider
    .state('tabs', {
      url: '/tab',
      abstract: true,
      templateUrl: 'templates/tabs.html'
    })

    .state('tabs.home', {
      url: '/home',
      views: {
        'home-tab' : {
          templateUrl: 'templates/home.html'
        }
      }
    })

    .state('tabs.list', {
      url: '/list',
      views: {
        'list-tab' : {
          templateUrl: 'templates/list.html',
          controller: 'ListController'
        }
      }
    })

    .state('tabs.detail', {
      url: '/list/:aId',
      views: {
        'list-tab' : {
          templateUrl: 'templates/detail.html',
          controller: 'ListController'
        }
      }
    });


  $urlRouterProvider.otherwise('/tab/home');
});

starter.controller('ListController', ['$scope', '$http', '$state',
    function($scope, $http, $state) {

    $scope.posts = [];  
    var startingPoint = 0;
    var limit = 1;

    $scope.load=function(startingPoint, limit){

    $http.get('js/data.json').success(function(data) {

      for(var i = startingPoint; i<=limit; i+=1){
          $scope.posts.push(data.posts[i]);
          $scope.whichpost=$state.params.aId;
      }

    })
     .finally(function(){
                    $scope.$broadcast('scroll.refreshComplete');
                    $scope.$broadcast('scroll.infiniteScrollComplete');
                });

    };

    $scope.get_more = function(){
                $scope.load(startingPoint, limit);
                limit+=2;
                startingPoint+=2;
            };   

    $scope.noMore = function(){
        return ($scope.posts.length > 50) ? false : true;
    };

}]);

THE PAGE SHOWING ALL THE INFO

<ion-header-bar class="bar-positive">
  <h2 class="title"></h2>
</ion-header-bar>

<ion-view view-title='Full article'>
  <ion-content>
    <ion-list class="list-inset">
      <ion-item class="item-text-wrap" ng-repeat="post in posts | filter: { id:whichpost }:true">
          <div class='textWrap'>
          <h2 class="articleAuth">{{ post.title }}</h2>

          <div>
          <p class="articleDate">By {{post.author}} on {{ post.date }} about <span class="category">{{ post.category }}</span></p>
      </div>

      </div>
      <img class='imagePhoto' ng-src="{{post.photo}}" alt=''/>
      <p class="textWrap">{{ post.description }}</p>
  </ion-item>
</ion-list>

DATA.JSON example

"id":"1",
      "category":"LIFE",
      "title":"Lorem Ipsum is simply dummy text",  
      "author": "StoyanGenchev",
      "date": "November 05, 1955",
      "photo": "img/test1.jpg",
      "description": "Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum."

Main Page

<ion-view view-title="Newest posts">
<div class="bar bar-subheader 
  item-input-inset bar-light">
  <label class="item-input-wrapper">
    <i class="icon ion-search placeholder-icon"></i>
    <input type="search" ng-model="query" placeholder="Search for post">
  </label>
</div>
<ion-content class="has-subheader">
    <ion-refresher on-refresh="load()">
    </ion-refresher>
    <ion-list>
        <ion-item ng-repeat='post in posts track by post.id | filter: query ' class='item-thumbnail-left item-text-wrap' href="#/tab/list/{{post.id}}">
            <img ng-src='{{post.photo}}' />
            <div>
            <p class='shortText titleArticle'>
                {{post.title | limitTo: 33}}
                {{ post.title.length > 33 ? '&hellip;' : '' }}
            </p>    
            <img class='articleAuthImg' src="img/StoyanGenchev.jpg" alt="StoyanGenchev-author" />    
            </div>
            <div class='articleInfo'>
            <h2>{{post.author}}</h2>
            <h4>{{post.date}}</h4>
            <h4 class="category">{{post.category}}</h4>
            </div>
            <div class="clear"></div>
            <p class='shortText'>
                {{post.description | limitTo: 200}}
                {{ post.description.length > 200 ? '&hellip;' : '' }}
            </p>
        </ion-item>
    </ion-list> 
    <ion-infinite-scroll
    ng-if="noMore()"    
    on-infinite="get_more()"
    distance="15%"
    >
  </ion-infinite-scroll>
</ion-content>
</ion-view>