Как правильно разделить ответ JSON на ng-repeat в Angularjs

Question

Я хочу использовать ng-repeat, чтобы разобрать мой ответ на переднем конце. У меня возникли проблемы с обработкой ответов, которые содержат несколько элементов по сравнению с одним элементом, используя список ng-repeat.

Я могу разобрать; но мне нужно создать 2 разных списка с отдельной конфигурацией ng-repeat на переднем конце и добавить некоторую уродливую логику, чтобы не отображать, если длина массива больше единицы.

Моя цель состоит в том, чтобы иметь только один элемент ng-repeat в моей частичной части, и он обрабатывает оба ответа или лучший подход к выполнению этого требования.

Подробное объяснение и jsfiddle ниже.
Я хочу использовать эту настройку ng-repeat для обоих ответов JSON.

<ul ng:repeat="report in reportConfigured.Reports"> 
    <li ng:repeat="reportItem in report">{{reportItem.ReportName.$}}</li> 
    </ul> 

Ниже приведен ответ, который я получаю из своего веб-сервиса при наличии нескольких отчетов.

{ 
    "Reports": { 
     "@xmlns": { 
      "$": "http:\/\/ws.wso2.org\/dataservice" 
     }, 
      "Report": [{ 
      "ReportID": { 
       "$": "20" 
      }, 
       "ReportName": { 
       "@xmlns": { 
        "$": "null" 
       }, 
        "$": "Examination Results" 
      }, 
       "VisibleToPartner": { 
       "$": "false" 
      }, 
       "ReportType": { 
       "@xmlns": { 
        "$": "null" 
       }, 
        "$": "Examination Report" 
      }, 
       "TemplateID": { 
       "$": "9" 
      } 
     }, { 
      "ReportID": { 
       "$": "163" 
      }, 
       "ReportName": { 
       "@xmlns": { 
        "$": "null" 
       }, 
        "$": "Scheduled Candidates with Test Center" 
      }, 
       "VisibleToPartner": { 
       "$": "false" 
      }, 
       "ReportType": { 
       "@xmlns": { 
        "$": "null" 
       }, 
        "$": "Examination Report" 
      }, 
       "TemplateID": { 
       "$": "220" 
      } 
     }, { 
      "ReportID": { 
       "$": "212" 
      }, 
       "ReportName": { 
       "@xmlns": { 
        "$": "null" 
       }, 
        "$": "Survey Report by Test" 
      }, 
       "VisibleToPartner": { 
       "$": "false" 
      }, 
       "ReportType": { 
       "@xmlns": { 
        "$": "null" 
       }, 
        "$": "Examination Report" 
      }, 
       "TemplateID": { 
       "$": "269" 
      } 
     }] 
    } 
}; 

Я получаю ответ от моей службы, когда есть только один отчет

{ 
    "Reports": { 
     "@xmlns": { 
      "$": "http:\/\/ws.wso2.org\/dataservice" 
     }, 
     "Report": { 
      "ReportID": { 
       "$": "212" 
      }, 
      "ReportName": { 
       "@xmlns": { 
        "$": "null" 
       }, 
       "$": "Survey Report by Test" 
      }, 
      "VisibleToPartner": { 
       "$": "true" 
      }, 
      "ReportType": { 
       "@xmlns": { 
        "$": "null" 
       }, 
       "$": "Examination Report" 
      }, 
      "TemplateID": { 
       "$": "269" 
      } 
     } 
    } 
} 

Я хочу, чтобы иметь возможность анализировать как ответы с тем же ng-repeat. Я добавил jsfiddle для более подробной информации.

http://jsfiddle.net/cejohnson/mdec9/1/

Answer 1

Я бы превратить то, что вы получите от сервера перед установкой его в качестве ng-repeat источника данных:

$http({...}) 
.success(function(data){ 
    if (angular.isArray(data.Reports.Report)) { 
     $scope.reports = data.Reports.Report; 
    } 
    else { 
     $scope.reports = [data.Reports.Report]; 
    } 
}); 

А потом

<ul ng:repeat="report in reports"> 
    <li ng:repeat="reportItem in report">{{reportItem.ReportName.$}}</li> 
</ul>