Google PageSpeed API의 JSON 응답에서 ng-repeat를 사용하는 데 이상한 문제가 있습니다. 기본적으로 작동하지만 이상한 BLANK UL을 반환하기 전에 올바른 응답이 이어집니다.
테스트 페이지 : http://staging.converge.io/test-json
내 컨트롤러 : (응답을 받으면 API 키를 변경합니다)
function FetchCtrl($scope, $http, $templateCache) {
$scope.method = 'GET';
$scope.url = 'https://www.googleapis.com/pagespeedonline/v1/runPagespeed?url=http://www.web.com&key=AIzaSyA5_ykqZChHFiUEc6ztklj9z8i6V6g3rdc';
$scope.key = 'AIzaSyA5_ykqZChHFiUEc6ztklj9z8i6V6g3rdc';
$scope.strategy = 'mobile';
$scope.fetch = function() {
$scope.code = null;
$scope.response = null;
$http({method: $scope.method, url: $scope.url + '&strategy=' + $scope.strategy, cache: $templateCache}).
success(function(data, status) {
$scope.status = status;
$scope.data = data;
}).
error(function(data, status) {
$scope.data = data || "Request failed";
$scope.status = status;
});
};
$scope.updateModel = function(method, url) {
$scope.method = method;
$scope.url = url;
};
}
HTML :
<ul ng-repeat="formattedResult in data.formattedResults">
<li ng-repeat="ruleResult in formattedResult">
<h4>{{ruleResult.localizedRuleName}}</h4>
<strong>Impact score</strong>: {{ruleResult.ruleImpact*10 | number:0}}
</li>
</ul>
도움을 주셔서 감사합니다!
응답에서 볼 수 있듯이은 formattedResults배열이 아니라 배열을 포함하는 객체입니다 ruleResults. 데이터에 액세스하는 방식을 변경해야합니다.
바꾸다:
<ul ng-repeat="formattedResult in data.formattedResults">
<li ng-repeat="ruleResult in formattedResult">
<h4>{{ruleResult.localizedRuleName}}</h4>
<strong>Impact score</strong>: {{ruleResult.ruleImpact*10 | number:0}}
</li>
</ul>
와
<ul>
<li ng-repeat="ruleResult in data.formattedResults.ruleResults">
<h4>{{ruleResult.localizedRuleName}}</h4>
<strong>Impact score</strong>: {{ruleResult.ruleImpact*10 | number:0}}
</li>
</ul>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다