Показать сообщение отдельно
  #10 (permalink)  
Старый 08.10.2013, 16:14
Новичок на форуме
Отправить личное сообщение для FerrisBuller Посмотреть профиль Найти все сообщения от FerrisBuller
 
Регистрация: 06.10.2013
Сообщений: 5

Я тут попытался , сделать три зависимых селекта , почему-то не вышло, подскажите ошибку

<!doctype html>
<html ng-app>
  <head>
    <script src="http://code.angularjs.org/1.2.0-rc.2/angular.min.js"></script>
    
  </head>
  <body>
    <div ng-controller="Controller">                  
<h2 >Магазинчег</h2>
      

          <table cols="2" width="90%" border="0">
             <tr><td><p>
              <label>Цвет рубашки</label>
              <select data-ng-model="currentGroup" data-ng-options="group.Name for group in groups"></select></p>
          
              <p><label>Тип рубашки</label>
              <select data-ng-model="currentItem" data-ng-options="item.Name for item in currentItems"></select></p>

			  <p><label>Запястье</label>
              <select data-ng-model="currentZap" data-ng-options="zap.Name for zap in currentZaps"></select></p></td>
                

    
      <td><img src="{{img}}"/></td><tr></table>
      
      <script>
        function Controller($scope) {
        
            var groups = [
                {
                	"Id": "1",
                    "Name": "Белое платье сшитое эльфами  ",
                    "Items": [
                        {
                            "Id": "1",
                            "Name": "Большое",
                            "img":"http://javascript.ru/forum/image.php?u=17434&dateline=1322593884f"
							"Zaps": [
								{
									"Id": "1",
									"Name": "2 Пуговки",
								    "img":"http://testmagaz.tw1.ru/wp-content/themes/magaz15/white/000.jpg"
								}, {
									"Id": "2",
									"Name": "3 Пуговки",
								    "img":"http://testmagaz.tw1.ru/wp-content/themes/magaz15/white/111.jpg"
								}
							]		
						}, {
                            "Id": "2",
                            "Name": "Маленькое",
                            "img":"http://javascript.ru/forum/image.php?u=14174&dateline=1380803229"                          
                        }, {
                            "Id": "3",
                            "Name": "Среднее",
                            "img":"http://javascript.ru/forum/image.php?u=11594&dateline=1352658958"
                        }, {
                            "Id": "4",
                            "Name": "XXL Для жиртресток",
                        	"img":"http://javascript.ru/forum/image.php?u=2666&dateline=1353162565"
                        }
                    ]
            	}, {
                	"Id": "2",
                    "Name": "Куртка из кожи с жопы дракона",
                    "Items": [
                        {
                            "Id": "5",
                            "Name": "Для детей",
                            "img":"http://javascript.ru/forum/image.php?u=11594&dateline=1352658958"
                    	}, {
                        	"Id": "6",
                        	"Name": "Для карликов",
                        	"img":"http://javascript.ru/forum/image.php?u=14174&dateline=1380803229"                          
                    	}, {
                        	"Id": "7",
                        	"Name": "Для гномов",
                        	"img":"http://javascript.ru/forum/image.php?u=2666&dateline=1353162565"
                    	}
                    ]
            	}];
        	
            $scope.groups = groups;                            // Все товары
            $scope.currentGroup = groups[0];                   // Выбранные товар
            $scope.currentItems = $scope.currentGroup.Items;   // Все размеры
            $scope.currentItem = $scope.currentItems[0];       // Выбраный размер
			$scope.currentZaps = $scope.currentItem.Zaps;
			$scope.currentZap = $scope.currentZaps[0];
            //Следим за изменением товара
            $scope.$watch('currentGroup', function () {
                $scope.currentItems = $scope.currentGroup.Items;
                $scope.currentItem = $scope.currentGroup.Items[0];
				$scope.currentZaps = $scope.currentGroup.Zaps;
                $scope.currentZap = $scope.currentGroup.Zaps[0];
            });

            //Следим за изменением размера
            $scope.$watch('currentItem', function () {
              	$scope.img = $scope.currentItem.img;          
            }),
             
			$scope.$watch('currentZap', function () {
				$scope.img = $scope.currentZap.img;
			})	
        }
      </script>
      
    </div>
  </body>
</html>
Ответить с цитированием