根据选择先前的下拉菜单angularjs，在下拉列表中随机播放项目的问题

Question

我正在尝试根据前一个下拉列表中的项目选择来对第二个下拉列表中的项目进行洗牌，一切正常，但问题是它不会更改父下拉列表中的值，而是为其子下拉列表添加正确的值下来。

这是我用于动态下拉的 Html：-

<div class="row" >
		<div class="col col-100 prod_det">
			<div class="desc select_prod">
				<div class="prod_col">
					<div class="col_list cont_padd"
						ng-repeat="item in configurableDataList">
						<label class="item item-input item-select">
							<div class="input-label">
								<b>{{item.label}}</b>
							</div> <select  id = "sel" class="form-control input-lg"
							ng-init="initSelection($index,item)" 
							ng-model="subjectSelectedId[$index]" required="required"
							ng-change="selectedSize(subjectSelectedId[$index],item.id )">
								<option ng-repeat="option in item.options" selected="selected" value="{{option}}">{{option.label}}</option>
								<option value="" disabled hidden>select</option>
						</select>
						</label>
					</div>
				</div>
			</div>
		</div>
	</div>

这是我的 java 脚本代码：-

$scope.subjectSelectedId = [];
					$scope.subjectSelected = [];
					$scope.initSelection = function(index, item) {
						$scope.subjectSelected.push(item);
						$scope.subjectSelectedId.push('');
					} 
					
					var UserSelectedArr = [];
					var isSelectedFirstTime = true;
					var btatrue = false;
					var dummyArr = [];
					$scope.selectedSize = function(value, attributeId) {
						var Sizedata = angular.fromJson(value);
						var sizedataArray = [];
						sizedataArray.push(Sizedata);

						if (dummyArr.length > 0) {
							check(sizedataArray, dummyArr);
						}
						function check(sizedataArray, dummyArr) {
							angular.forEach(sizedataArray, function(value1,
									key1) {
								angular.forEach(dummyArr,
										function(value2, key2) {
											alert("dummyArr" + value2.id + " "
													+ "Sizedata" + value1.id);
											if (value1.id === value2.id) {

												btatrue = true;
											} else {
												btatrue = false;
											}
										});
							});
						}
						if (btatrue) {
							return;
						}
						$scope.configurableDataList = LocalStorage
								.getObject("configurableDataListFull");

						for ( var i = 0; i < $scope.configurableDataList.length; i++) {
							if (attributeId != $scope.configurableDataList[i].id) {
								if (dummyArr.length > 0) {
									dummyArr = [];
								}
								for ( var j = 0; j < Sizedata.products.length; j++) {
									for ( var k = 0; k < $scope.configurableDataList[i].options.length; k++) {
										for ( var l = 0; l < $scope.configurableDataList[i].options[k].products.length; l++) {
											alert(JSON
													.stringify(Sizedata.products[j]));
											alert(JSON
													.stringify($scope.configurableDataList[i].options[k].products[l]));
											if (Sizedata.products[j] == $scope.configurableDataList[i].options[k].products[l]) {
												dummyArr
														.push($scope.configurableDataList[i].options[k]);
												$scope.configurableDataList[i].options = dummyArr;

												alert("check :"
														+ JSON
																.stringify($scope.configurableDataList[i].options));
												return;
											} else {
												alert("chak 250 :")
											}
										}
									}
								}

								console.log('dummyArr :', dummyArr);

							} else {
								if (isSelectedFirstTime) {
									console.log('abc');
									UserSelectedArr = $scope.configurableDataList[i].options;
									isSelectedFirstTime = false;
								}
							}
						}

这是我的 json :- http://piratepad.net/ep/pad/view/ro.5GeXFI9Xy2P/latest

我需要的是，当我选择黑色时，另一个显示下拉列表仅包含与黑色相对应的值，基于条件，如果是“S”，即小，如果是蓝色，则显示“XL”。虽然它工作正常但当我选择黑色时，它总是在父下拉列表中显示为蓝色，但我的子下拉列表中确实获得了“S”。问题是我怎样才能让父下拉列表选择黑色。

我尝试制作 plunker，因为我是新手，但我无法......但我将所有必需的代码都放入其中。

简而言之，请为我提供获取 $index 的方法：-

<option ng-repeat="option in item.options" selected="selected" value="{{option}}">{{option.label}}</option>

plunker :- http://plnkr.co/edit/PUKaIRUApSQu4qLqtD2e?p=preview

我尝试了以下方法，但它没有在子下拉菜单中为我提供相应的选项：-

 selected="selected"
								
									ng-options="item.options.indexOf(subjectSelectedId[$index]) as subjectSelectedId[$index] for subjectSelectedId[$index] in item.options">
								<option value="" disabled hidden>select</option>

还有：-

<option ng-selected="subjectSelectedId[$parent.$index] == option.label" ng-repeat="option in item.options" value="{{option}}" selected="selected">{{option.label}}</option>
<option value="" disabled hidden>select</option>

任何帮助将不胜感激

谢谢

Answer 1

我终于完成了..我通过使用 ng-options 解决了它：-

这是我的解决方案：-

<select class="form-control input-lg" ng-init="initSelection($index,item)" ng-model="subjectSelectedId[$index]" required="required" ng-change="selectedSize(subjectSelectedId[$index],item.id )" ng-selected="subjectSelectedId[$parent.$index] == option.id"
ng-options="option.label for option in item.options track by option.id">
  <option value="" disabled hidden>Please select</option>
</select>