我有这个 JSON 数据:
{
"doorTypes": [
{
"name": "Flat Panel",
"image": "doors/flatpanel.png",
"type": "Wood"
},
{
"name": "Raised Panel",
"image": "doors/raisedpanel.png",
"type": "Wood"
},
{
"name": "Slab Door",
"image": "doors/slabdoor.png",
"type": "Wood"
}],
"woods": [
{
"name": "Alder",
"image": "species/alder.png",
"weights":[
{
"name": "Flat Panel",
"weight": 1.19
},
{
"name": "Raised Panel",
"weight": 1.76
},
{
"name": "Slab Door",
"weight": 1.97
}]
},
{
"name": "Ash",
"image": "species/ash.png",
"weights":[
{
"name": "Flat Panel",
"weight": 1.7
}]
},
{
"name": "Bamboo",
"image": "species/bamboo.png",
"weights":[
{
"name": "Slab Door",
"weight": 2.7
}]
},
{
"name": "Beech",
"image": "species/beech.png",
"weights":[
{
"name": "Raised Panel",
"weight": 2.27
},
{
"name": "Slab Door",
"weight": 2.54
}]
}]
}
根据doorType
您选择的内容,我想过滤wood
类型。例如,如果您选择Raised Panel
,我只希望显示有重量的树林Raised Panel
。所以在这种情况下,Alder and Beech
会显示,不Ash
或Bamboo
现在我严格使用 ng-repeat,它显示了所有的木材类型。我查看了 ng-filter 的文档,但我不确定如何在weights
对象具有多个属性的情况下应用它。
我当前的 ng 重复:
<ul class="touchcarousel-container">
<li class="touchcarousel-item" ng-repeat="obj in currentObject">
<div class="img-select" ng-click="setActive(this)" ng-class="{itemSelected : isActive(this)}">
<div align="center">
<img ng-src="resources/images/aventos/{{obj.image}}" />
</div>
<div class="img-title">{{obj.name}}</div>
</div>
</li>
</ul>
如果这样做更有意义,我也愿意更改我的 JSON。
编辑
这是我的解决方案:
<li class="touchcarousel-item" ng-repeat="obj in currentObject" ng-show="woodTypes(obj)">
接着:
$scope.woodTypes = function(obj)
{
var shown = false;
for (var i = 0; i < obj.weights.length; i++)
{
if (obj.weights[i].name == $scope.cabinetDetails.door.name)
{
shown = true;
break;
}
}
return shown;
}