我在ng-repeat内部选择时出现问题,问题是我在ng-repeat中创建的每个选项都被禁用,如果我尝试打开下拉列表,它就不会显示选项。
选择是在ng-repeat中生成的,选择的数量和所有值都是 在JSON中。
我认为问题可能是选择模型,我必须动态分配ng模型,但我不知道如何。
这是代码(我不包含获取JSON的服务,但它确实有效)
JSON
[
{
"Id":1,
"Name":"Tipo Fuga",
"Values":[
{
"Name":"Tipo Fuga",
"Value":"Week End in Famiglia",
"Id":10555
},
{
"Name":"Tipo Fuga",
"Value":"Fuga romantica",
"Id":10560
}
]
},
{
"Id":2,
"Name":"Localita",
"Values":[
{
"Name":"Localita",
"Value":"Al mare",
"Id":111
},
{
"Name":"Localita",
"Value":"In montagna",
"Id":112
}
]
},
{
"Id":3,
"Name":"Num Notti",
"Values":[
{
"Name":"Num Notti",
"Value":"1",
"Id":11076
},
{
"Name":"Num Notti",
"Value":"2",
"Id":11077
}
]
},
{
"Id":4,
"Name":"Tipo Soggiorno",
"Values":[
{
"Name":"Tipo Soggiorno",
"Value":"1 stella",
"Id":1100
},
{
"Name":"Tipo Soggiorno",
"Value":"2 stelle",
"Id":1101
}
]
}
]
HTML
<div ng-controller="ricercaAttivita">
<div ng-repeat="masterAttribute in masterAttributes">
<select ng-model="selected-attr" ng-options="attr.Id as attr.Value for attr in masterAttribute.Values">
</select>
</div>
</div>
CONTROLLER
tantoSvagoApp.controller("ricercaAttivita", function ($scope, $http, serviceRicercaAttivita) {
var parametersMaster = {"Id": master};
serviceRicercaAttivita.getMasterAttributes(parametersMaster,
successCallBackMasterAttributes);
function successCallBackMasterAttributes(result) {
$scope.masterAttributes = result;
}
});
修改
我尝试做一个简单的事情,我在div中创建了一个带有静态选项的选项,当然它运行正常:
<div>
<select>
<option value="">TUTTE</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
如果我将ng-repeat指令放在select中不起作用,则意味着我无法打开下拉列表然后选择该选项。
<div ng-repeat="masterAttribute in masterAttributes">
<select>
<option value="">TUTTE</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
</select>
</div>
答案 0 :(得分:0)
问题陈述似乎含糊不清。
ng-model
可以是JSON中的新属性,用于保存id
中选定的select
。
var app = angular.module("MyApp", []);
app.controller("ricercaAttivita", function($scope) {
$scope.masterAttributes = [{
"Id": 1,
"Name": "Tipo Fuga",
"Values": [{
"Name": "Tipo Fuga",
"Value": "Week End in Famiglia",
"Id": 10555
},
{
"Name": "Tipo Fuga",
"Value": "Fuga romantica",
"Id": 10560
}
]
},
{
"Id": 2,
"Name": "Localita",
"Values": [{
"Name": "Localita",
"Value": "Al mare",
"Id": 111
},
{
"Name": "Localita",
"Value": "In montagna",
"Id": 112
}
]
},
{
"Id": 3,
"Name": "Num Notti",
"Values": [{
"Name": "Num Notti",
"Value": "1",
"Id": 11076
},
{
"Name": "Num Notti",
"Value": "2",
"Id": 11077
}
]
},
{
"Id": 4,
"Name": "Tipo Soggiorno",
"Values": [{
"Name": "Tipo Soggiorno",
"Value": "1 stella",
"Id": 1100
},
{
"Name": "Tipo Soggiorno",
"Value": "2 stelle",
"Id": 1101
}
]
}
];
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="MyApp" ng-controller="ricercaAttivita">
<div ng-repeat="masterAttribute in masterAttributes">
<select ng-model="masterAttribute.Selected" ng-options="attr.Id as attr.Value for attr in masterAttribute.Values">
</select>
</div>
<pre>{{masterAttributes | json}}</pre>
</body>