Jsonの子オブジェクトにデータを埋め込む

Question

私は親のIDに基づいて下のjsonから子オブジェクトを取り込みしようとしていますが、いくつかの問題に直面しています。私はJsonで新しくなっていますので、私はいくつかの解決策を教えてください。私はchild1、child2 child3を表示するように杖を掛けました。ページIDが2ならば、私は親IDの基礎を下にしてjsonから子オブジェクトを設定しようとしています。ここで助けてください。私はそう私にいくつかのソリューションを提案してくださいJSONに新しいです、私はページIDは、IDに基づいて、現在のページを取得するために、2

[ 
    { 
     "id": "2", 
     "slug": "parent", 
     "title": "Parent", 
     "subcategories": [ 
      { 
       "id": "12", 
       "slug": "child1", 
       "title": "child1" 
      }, 
      { 
       "id": "14", 
       "slug": "child2", 
       "title": "child2" 
      }, 
      { 
       "id": "15", 
       "slug": "child3", 
       "title": "child3" 
      }, 
      { 
       "id": "16", 
       "slug": "child4", 
       "title": "child4" 
      } 
     ] 
    }, 
    { 
     "id": "11", 
     "slug": "parent2", 
     "title": "Parent2", 
     "subcategories": [ 
      { 
       "id": "32", 
       "slug": "child1", 
       "title": "child1" 
      }, 
      { 
       "id": "33", 
       "slug": "child2", 
       "title": "child3" 
      } 
     ] 
    } 
] 

[ 
    { 
     "id": "2", 
     "slug": "parent", 
     "title": "Parent", 
     "subcategories": [ 
      { 
       "id": "12", 
       "slug": "child1", 
       "title": "child1" 
      }, 
      { 
       "id": "14", 
       "slug": "child2", 
       "title": "child2" 
      }, 
      { 
       "id": "15", 
       "slug": "child3", 
       "title": "child3" 
      }, 
      { 
       "id": "16", 
       "slug": "child4", 
       "title": "child4" 
      } 
     ] 
    }, 
    { 
     "id": "11", 
     "slug": "parent2", 
     "title": "Parent2", 
     "subcategories": [ 
      { 
       "id": "32", 
       "slug": "child1", 
       "title": "child1" 
      }, 
      { 
       "id": "33", 
       "slug": "child2", 
       "title": "child3" 
      } 
     ] 
    } 
] 

$.getJSON("data.json" , function(json) { 
    $.each(json,function(i, value){ 
     $.each(value.subcategories, function(index, obj){ 
      $('#list-category-slider').append('<div class="item"><a href="/' + obj.slug + '">' + obj.title + '</a></div>'); 
     }) 
    }); 
}); 

Answer 1

まず、フィルタアレイである場合child1の、child2のchild3を表示するワンド。プロパティを繰り返してリストを作成します。テストでは、PAGEIDが2

$(function(){ 
 
    var json = 
 
\t [ 
 
\t \t { 
 
\t \t \t "id": "2", 
 
\t \t \t "slug": "parent", 
 
\t \t \t "title": "Parent", 
 
\t \t \t "subcategories": [ 
 
\t \t \t \t { 
 
\t \t \t \t \t "id": "12", 
 
\t \t \t \t \t "slug": "child1", 
 
\t \t \t \t \t "title": "child1" 
 
\t \t \t \t }, 
 
\t \t \t \t { 
 
\t \t \t \t \t "id": "14", 
 
\t \t \t \t \t "slug": "child2", 
 
\t \t \t \t \t "title": "child2" 
 
\t \t \t \t }, 
 
\t \t \t \t { 
 
\t \t \t \t \t "id": "15", 
 
\t \t \t \t \t "slug": "child3", 
 
\t \t \t \t \t "title": "child3" 
 
\t \t \t \t }, 
 
\t \t \t \t { 
 
\t \t \t \t \t "id": "16", 
 
\t \t \t \t \t "slug": "child4", 
 
\t \t \t \t \t "title": "child4" 
 
\t \t \t \t } 
 
\t \t \t ] 
 
\t \t }, 
 
\t \t { 
 
\t \t \t "id": "11", 
 
\t \t \t "slug": "parent2", 
 
\t \t \t "title": "Parent2", 
 
\t \t \t "subcategories": [ 
 
\t \t \t \t { 
 
\t \t \t \t \t "id": "32", 
 
\t \t \t \t \t "slug": "child1", 
 
\t \t \t \t \t "title": "child1" 
 
\t \t \t \t }, 
 
\t \t \t \t { 
 
\t \t \t \t \t "id": "33", 
 
\t \t \t \t \t "slug": "child2", 
 
\t \t \t \t \t "title": "child3" 
 
\t \t \t \t } 
 
\t \t \t ] 
 
\t \t } 
 
\t ] 
 

 
\t var pageId = 2; 
 
\t var currentPage = json.filter(function(el){ 
 
\t \t return el.id == pageId; 
 
\t })[0]; \t 
 
\t $.each(currentPage.subcategories, function(index, obj){ 
 
\t \t $('#list-category-slider').append('<div class="item"><a href="/' + obj.slug + '">' + obj.title + '</a></div>'); 
 
\t }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id='list-category-slider'> 
 

 
</div>