AngularJS ng-重复对象数组

我有一个带有2个数组的Object:

mainObject = {
  soccer: [],
  hockey: []
}

每个数组都包含不同数量的对象:

sportObject = {
  soccer: [{equipment: "cleats"}, {shirt: "jersey"}, {team: "arsenal"}],
  hockey: [{equipment: "skates"}]
}

我使用列表将每个对象打印到页面上,用"sport"分隔:

  
{{sport}}
 // Prints "soccer" or "hockey"

  
 //  <-- one of my failed attempts

我想将每个对象信息打印到li正确的运动名称下.

例如,共有4个对象,足球有3个,曲棍球有1个.

目前,每个项目在两项运动下都会重复出现.所以这两项运动都有4个项目.如何使用ng-repeat仅打印属于正确运动标题的设备？

结果应如下所示:

足球

设备:防滑钉

衬衫:球衣

球队:阿森纳

曲棍球

装备:溜冰鞋

GPicazo.. 5

以下应该可以解决问题：

  
{{sport}}
    

      

        
          {{detailkey}} - {{detailvalue}}
        
      
    
  

请注意，您必须进行3次迭代：

第一个超过原始对象

每个原始对象值中的第二个数组对象

数组内对象的第三个

这是适合您的工作版本：https : //plnkr.co/edit/WKNRU6U6xwGgKRq4chhT?p=preview

以下应该可以解决问题：

  
{{sport}}
    

      

        
          {{detailkey}} - {{detailvalue}}
        
      
    
  

请注意，您必须进行3次迭代：

第一个超过原始对象

每个原始对象值中的第二个数组对象

数组内对象的第三个

这是适合您的工作版本：https : //plnkr.co/edit/WKNRU6U6xwGgKRq4chhT?p=preview