1

私はこの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 を使用しており、すべての木材の種類を表示しています。weightsng-filter のドキュメントを見てきましたが、オブジェクトに複数のプロパティがある場合に適用する方法がわかりません。

私の現在のng-repeat:

<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 を変更することがより理にかなっている場合は、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;
}
4

1 に答える 1