Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.06.2014, 18:58
Аватар для sun-ks
Интересующийся
Отправить личное сообщение для sun-ks Посмотреть профиль Найти все сообщения от sun-ks
 
Регистрация: 15.04.2014
Сообщений: 15

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}} (ид девайса на который мы кликнули.)
Ответить с цитированием
  #2 (permalink)  
Старый 20.06.2014, 20:34
Аватар для a.malitsky
Аспирант
Отправить личное сообщение для a.malitsky Посмотреть профиль Найти все сообщения от a.malitsky
 
Регистрация: 26.03.2010
Сообщений: 56

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

Последний раз редактировалось a.malitsky, 20.06.2014 в 20:40.
Ответить с цитированием
  #3 (permalink)  
Старый 23.06.2014, 11:45
Аватар для sun-ks
Интересующийся
Отправить личное сообщение для sun-ks Посмотреть профиль Найти все сообщения от sun-ks
 
Регистрация: 15.04.2014
Сообщений: 15

написал
<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>

Ничего не выводит =(
Ответить с цитированием
  #4 (permalink)  
Старый 24.06.2014, 09:30
Аватар для a.malitsky
Аспирант
Отправить личное сообщение для a.malitsky Посмотреть профиль Найти все сообщения от a.malitsky
 
Регистрация: 26.03.2010
Сообщений: 56

нужно заинклудить $stateParams в контроллер или директиву и: $stateParams.list.id
фидлер создай если не справляешься
Ответить с цитированием
  #5 (permalink)  
Старый 24.06.2014, 12:34
Аватар для sun-ks
Интересующийся
Отправить личное сообщение для sun-ks Посмотреть профиль Найти все сообщения от sun-ks
 
Регистрация: 15.04.2014
Сообщений: 15

Спасибо за помощь , но у меня нефига не получается.
написал в контролере
/* 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
Ответить с цитированием
  #6 (permalink)  
Старый 24.06.2014, 18:55
Аватар для a.malitsky
Аспирант
Отправить личное сообщение для a.malitsky Посмотреть профиль Найти все сообщения от a.malitsky
 
Регистрация: 26.03.2010
Сообщений: 56

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 без привязки ко скоупу, но разбираться сейчас некогда.

Последний раз редактировалось a.malitsky, 24.06.2014 в 19:09.
Ответить с цитированием
  #7 (permalink)  
Старый 30.06.2014, 18:47
Аватар для sun-ks
Интересующийся
Отправить личное сообщение для sun-ks Посмотреть профиль Найти все сообщения от sun-ks
 
Регистрация: 15.04.2014
Сообщений: 15

Еще вопрос, предположим я сделал фронтенжд часть, переходы между страничками осоществляется, вообщем визуально все есть. Данные беруться из json файлика. Как сделсть формирование этого json? запись в него изменение? Может стоит написать на пхп бэкенд чатсть, которая бы делала запись в базу изменение базы, формировала бы json на основе базы.
П.с. Я занимаюсь версткой, + раздичные эффекты. Сложный js и бэкенд для меня не повседневная работа, прошу не плюваться если что не так спросил.
Ответить с цитированием
  #8 (permalink)  
Старый 01.07.2014, 09:30
Аватар для a.malitsky
Аспирант
Отправить личное сообщение для a.malitsky Посмотреть профиль Найти все сообщения от a.malitsky
 
Регистрация: 26.03.2010
Сообщений: 56

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



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
плавный переход через javascript blacklool (X)HTML/CSS 1 19.01.2014 16:04
jq Router необязательный параметр Andrei jQuery 0 08.11.2011 12:21
JS и getURL плавный переход к anchor Blizzart Общие вопросы Javascript 4 16.01.2011 17:48
переход по ссылке через N секунд jerryfish Events/DOM/Window 4 23.02.2010 17:05
При нажатии на ссылку браузер запоминает как переход на др страничку mff AJAX и COMET 13 17.02.2010 21:46