ui-router переход на страничку с товаром.
 

Пишу админку для учета ремонтируемых девайсов, использую ui-router для перехода по страничкам. На главной сранице у меня идет вывод всех девайсов в ремонте (привожу пример json массива устройств):
[
{
"id": "1",
"data" : "2014-04-07 16:05 -07:00",
"device" : "nokia l50",
},{
"id": "2",
"data" : "2014-04-07 16:05 -07:00",
"device" : "nokia l50",
}
]
Через ng-repeat идет вывод всего json файла.
<tr data-ng-repeat = "list in main_list | filter:search" ui- sref="unit_page">
<td class="main-list-item">{{list.id}}</td>
<td class="main-list-item">{{list.data}}</td>
<td class="main-list-item">{{list.device}}</td>
</tr>
Как сделать что бы при клике на тег <TR> Мы попали перенеслись на unit_page и могли выбрать {{list.device}} {{list.data}} , соотвецвующие {{list.id}} (ид девайса на который мы кликнули.)

ui-sref="unit_page({phone.id:list.id, date:list.data})", а на unit_page используешь эти данные
или в самой URI типа orders/phones/edit/{deviceId} (надо прописать в stateProvider).

написал

<tr data-ng-repeat = "list in main_list | filter:search" ui-sref="unit_page({phone.id:list.id, date:list.data})">
			<td class="main-list-item">{{list.id}}</td>
			<td class="main-list-item">{{list.data}}</td>
			<td class="main-list-item">{{list.device}}</td>
			<td class="main-list-item">{{list.description}}</td>
			<td class="main-list-item">{{list.state}}</td>
			<td class="main-list-item">{{list.name}}</td>
			<td class="main-list-item">{{list.lastname}}</td>
			<td class="main-list-item">{{list.phone}}</td>
		</tr>

на страничке unit_page :

<div ng-controller="listCtrl" >
<ul>
  <li >{{phone.id}}</li>
</ul>
</div>

Ничего не выводит =(

нужно заинклудить $stateParams в контроллер или директиву и: $stateParams.list.id
фидлер создай если не справляешься

Спасибо за помощь , но у меня нефига не получается.
написал в контролере

/* Controllers */

var phonecatApp = angular.module('phonecatApp', []);

phonecatApp.controller('PhoneListCtrl', function($scope, $http, $stateParams) {
  $http.get('phones/phones.json').success(function(data) {
    $scope.phones = data;
  });

  $scope.orderProp = 'age';
});

не могу понять логику происходящего...
Прикрепил свои наброски, буду рад помощи.
https://www.dropbox.com/s/mygqthd3ri0chke/angularjs.zip

var listCtrl = myapp.controller( 'listCtrl', ['$scope', '$rootScope', '$http', '$stateParams', function( $scope, $rootScope, $http, $stateParams){
        $scope.params = $stateParams;
	$http.get( 'json/main_list.json' ).success( function( data ) {
	$scope.main_list = data;
	}).error(function(data) {console.log( 'error main_list.json' )});
}]);

<div ng-controller="listCtrl" >
<ul>
  <li>{{params.phoneId}}</li>  
</ul>
</div>

<tr data-ng-repeat = "list in main_list | filter:search">
<td class="main-list-item">
    <a ui-sref="unit_page({phoneId:list.id})">{{list.id}}</a>
</td>

Не понимаю, почему темплейт не видит $stateParams без привязки ко скоупу, но разбираться сейчас некогда.

Еще вопрос, предположим я сделал фронтенжд часть, переходы между страничками осоществляется, вообщем визуально все есть. Данные беруться из json файлика. Как сделсть формирование этого json? запись в него изменение? Может стоит написать на пхп бэкенд чатсть, которая бы делала запись в базу изменение базы, формировала бы json на основе базы.
П.с. Я занимаюсь версткой, + раздичные эффекты. Сложный js и бэкенд для меня не повседневная работа, прошу не плюваться если что не так спросил. :)

Русский неродной язык у тебя?
Да, для изменения данных и формирования новых наборов данных нужен backend.