2016-07-27 4 views
2

내가하려고하는 것은 JSON 개체의 배열에 중첩 된 범주를 기반으로 필터링 할 수있는 개요를 만드는 것입니다. 나는 이런 식으로 뭔가를 보일 것의 개요를 생성 할 항목의각도 JS 필터 범주 배열을 기반으로 개요

json으로는 :

<select ng-model="catselect"> 
    <option>cat1</option> 
    <option>cat2</option> 
    <option>cat3</option> 
    <option>cat4</option> 
</select> 
<ul> 
    <li ng-repeat="item in array | filter: {ARRAY OF CATEGORIES: catselect}"> 

    </li> 
</ul> 

은 현재 내가 어떻게 단서가 없다 :

{ 
    id: 1, 
    title: "title", 
    content: "content", 
    categories: [{ 
     title: "cat1", 
     descripton: "desc" 
    }, 
    { 
     title: "cat2", 
     descripton: "desc" 
    }] 
}, 
{ 
    id: 2, 
    title: "title", 
    content: "content", 
    categories: [{ 
     title: "cat3", 
     descripton: "desc" 
    }, 
    { 
     title: "cat4", 
     descripton: "desc" 
    }] 
} 

html로이 같이 보입니다 이것을 작동 시키십시오. (나는) 가장 확실한 해결책은 filter: {categories.title: catselect}과 같아야한다고 생각하지만 분명히 그렇지 않다. 늘어나는만큼 Stackoverflow에 다른 질문이 문제를 태클 알아요. 나는 누군가가 나를 도와 줄 수 있는지에 관심이 많다.

답변

0

작동하는지 확인해 볼 수 있습니까? 나는 그것을 실제로 테스트하지 않았다.

filter: { categories: { title: catselect } } 
+0

감사를 작동합니다! 이 솔루션 솔루션은 작동하지 않았다 : ( –

+0

같은 내 대답의 유사 시도 : 필터 : {categories : {title : catselect}} 또는 다른이, 내 개체 안에 개체가있을 때 이것은 실제로 나를 위해 작동하지 않았다. 객체 내부의 배열 .. –

+0

실제로 작동합니다! :) 대답을 편집하여 받아 들일 수 있습니까? –

0

사용자 정의 필터는 당신의 문제에 대한

angular.module("app", []) 
 
    .controller("test", function($scope) { 
 

 
    $scope.array = [{ 
 
     id: 1, 
 
     title: "title", 
 
     content: "content", 
 
     categories: [{ 
 
     title: "cat1", 
 
     descripton: "desc" 
 
     }, { 
 
     title: "cat2", 
 
     descripton: "desc" 
 
     }] 
 
    }, { 
 
     id: 2, 
 
     title: "title2", 
 
     content: "content", 
 
     categories: [{ 
 
     title: "cat3", 
 
     descripton: "desc" 
 
     }, { 
 
     title: "cat4", 
 
     descripton: "desc" 
 
     }] 
 
    }] 
 
    }) 
 
    .filter("filterByCat", function() { 
 
    return function(input, catselect) { 
 
     if (catselect != undefined) { 
 
     var f = [] 
 
     angular.forEach(input, function(el) { 
 
      if ((el.categories.filter(function(cat) { 
 
      return cat.title == catselect 
 
      })).length > 0) f.push(el); 
 
     }) 
 
     return f; 
 
     } else { 
 
     return input; 
 
     } 
 
    } 
 
    });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app" ng-controller="test"> 
 
    <select ng-model="catselect"> 
 
    <option>cat1</option> 
 
    <option>cat2</option> 
 
    <option>cat3</option> 
 
    <option>cat4</option> 
 
    </select> 
 
    <ul> 
 
    <li ng-repeat="item in array | filterByCat:catselect">{{item.title}}</li> 
 
    </ul> 
 
</div>