2015-11-03 2 views
0

Я застрял в извлечении данных, я получил список источников, но не знаю, как делать даты в этом примере. Было бы замечательно, если бы кто-нибудь мог меня направить.Получение данных в angularjs

<!DOCTYPE html> 
<html data-ng-app="myApp"> 

<head> 
    <meta charset="utf-8" /> 
    <title>AyimaData</title> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
</head> 

<body> 
    <div data-ng-controller="customersCtrl"> 
    <ul> 
     <li data-ng-repeat="x in ayima"> 
     <p>{{ x.domain }}</p> 
     </li> 
    </ul> 
    </div> 
    <script> 
    var app = angular.module('myApp', []); 
    app.controller('customersCtrl', function($scope, $http) { 
     $http.get("http://dfjb.webcindario.com/dataAyima.php") 
     .success(function(response) { 
      $scope.ayima = response.marketIntel; 
     }) 
     .error(function(data, status, headers, config) { 
      // something went wrong 
     }); 
    }); 
    </script> 
</body> 

</html> 

данных выглядит как этот

{ 
    "marketIntel": [ 
    { 
     "domain": "apple.com", 
     "scores": { 
     "2015-09-26": 9.9, 
     "2015-09-27": 9.73, 
     "2015-09-28": 9.91, 
     "2015-09-29": 9.4, 
     "2015-09-30": 10.16, 
     "2015-10-01": 9.59, 
     "2015-10-02": 10.16, 
     "2015-10-03": 9.67, 
     "2015-10-04": 10.13, 
     "2015-10-05": 10.33, 
     "2015-10-06": 9.6, 
     "2015-10-07": 9.97, 
     "2015-10-08": 10.14, 
     "2015-10-09": 9.59, 
     "2015-10-10": 9.49, 
     "2015-10-11": 9.56, 
     "2015-10-12": 9.57, 
     "2015-10-13": 9.57, 
     "2015-10-14": 9.52, 
     "2015-10-15": 9.94, 
     "2015-10-16": 9.5, 
     "2015-10-17": 9.59, 
     "2015-10-18": 10.19, 
     "2015-10-19": 10.03, 
     "2015-10-20": 9.59, 
     "2015-10-21": 10.12, 
     "2015-10-22": 9.83, 
     "2015-10-23": 9.96, 
     "2015-10-24": 9.46, 
     "2015-10-25": 9.54 
     } 
    }, 
    { 
     "domain": "techradar.com", 
     "scores": { 
     "2015-09-26": 8.66, 
     "2015-09-27": 9.16, 
     "2015-09-28": 9.07, 
     "2015-09-29": 8.98, 
     "2015-09-30": 9.14, 
     "2015-10-01": 8.9, 
     "2015-10-02": 9.07, 
     "2015-10-03": 8.92, 
     "2015-10-04": 9.12, 
     "2015-10-05": 9.5, 
     "2015-10-06": 9.41, 
     "2015-10-07": 9.21, 
     "2015-10-08": 9.28, 
     "2015-10-09": 9.38, 
     "2015-10-10": 9.5, 
     "2015-10-11": 8.85, 
     "2015-10-12": 9.38, 
     "2015-10-13": 9, 
     "2015-10-14": 8.87, 
     "2015-10-15": 8.9, 
     "2015-10-16": 9.06, 
     "2015-10-17": 9.03, 
     "2015-10-18": 8.87, 
     "2015-10-19": 9.34, 
     "2015-10-20": 9.14, 
     "2015-10-21": 8.87, 
     "2015-10-22": 9.34, 
     "2015-10-23": 9.19, 
     "2015-10-24": 9.02, 
     "2015-10-25": 9.4 
     } 
    }, 
    { 
     "domain": "carphonewarehouse.com", 
     "scores": { 
     "2015-09-26": 7.89, 
     "2015-09-27": 7.39, 
     "2015-09-28": 7.66, 
     "2015-09-29": 7.37, 
     "2015-09-30": 7.31, 
     "2015-10-01": 7.33, 
     "2015-10-02": 7.46, 
     "2015-10-03": 7.39, 
     "2015-10-04": 7.43, 
     "2015-10-05": 7.46, 
     "2015-10-06": 7.35, 
     "2015-10-07": 7.39, 
     "2015-10-08": 7.98, 
     "2015-10-09": 7.79, 
     "2015-10-10": 7.63, 
     "2015-10-11": 7.65, 
     "2015-10-12": 7.6, 
     "2015-10-13": 7.85, 
     "2015-10-14": 7.46, 
     "2015-10-15": 7.88, 
     "2015-10-16": 7.66, 
     "2015-10-17": 7.3, 
     "2015-10-18": 7.26, 
     "2015-10-19": 7.37, 
     "2015-10-20": 7.41, 
     "2015-10-21": 7.21, 
     "2015-10-22": 7.26, 
     "2015-10-23": 7.17, 
     "2015-10-24": 7.21, 
     "2015-10-25": 7.14 
     } 
    }, 
    { 
     "domain": "samsung.com", 
     "scores": { 
     "2015-09-26": 6.99, 
     "2015-09-27": 7.03, 
     "2015-09-28": 7.1, 
     "2015-09-29": 7.19, 
     "2015-09-30": 7.21, 
     "2015-10-01": 7.16, 
     "2015-10-02": 6.99, 
     "2015-10-03": 6.99, 
     "2015-10-04": 6.92, 
     "2015-10-05": 6.92, 
     "2015-10-06": 6.93, 
     "2015-10-07": 6.95, 
     "2015-10-08": 6.96, 
     "2015-10-09": 6.91, 
     "2015-10-10": 6.88, 
     "2015-10-11": 7.09, 
     "2015-10-12": 7.07, 
     "2015-10-13": 7.17, 
     "2015-10-14": 7.24, 
     "2015-10-15": 7.06, 
     "2015-10-16": 7.02, 
     "2015-10-17": 7.08, 
     "2015-10-18": 6.98, 
     "2015-10-19": 6.91, 
     "2015-10-20": 7.13, 
     "2015-10-21": 6.94, 
     "2015-10-22": 6.96, 
     "2015-10-23": 7.12, 
     "2015-10-24": 7.13, 
     "2015-10-25": 6.94 
     } 
    }, 
    { 
     "domain": "amazon.co.uk", 
     "scores": { 
     "2015-09-26": 5.28, 
     "2015-09-27": 5.19, 
     "2015-09-28": 5.23, 
     "2015-09-29": 5.32, 
     "2015-09-30": 5.33, 
     "2015-10-01": 5.25, 
     "2015-10-02": 5.25, 
     "2015-10-03": 5.17, 
     "2015-10-04": 4.96, 
     "2015-10-05": 5.15, 
     "2015-10-06": 5.27, 
     "2015-10-07": 5.23, 
     "2015-10-08": 5.36, 
     "2015-10-09": 5.15, 
     "2015-10-10": 5.02, 
     "2015-10-11": 5.09, 
     "2015-10-12": 5.08, 
     "2015-10-13": 5.12, 
     "2015-10-14": 5.14, 
     "2015-10-15": 5.17, 
     "2015-10-16": 5.25, 
     "2015-10-17": 5.18, 
     "2015-10-18": 5.09, 
     "2015-10-19": 5.09, 
     "2015-10-20": 5.18, 
     "2015-10-21": 5.32, 
     "2015-10-22": 5.33, 
     "2015-10-23": 5.26, 
     "2015-10-24": 5.23, 
     "2015-10-25": 5.31 
     } 
    }, 
    { 
     "domain": "trustedreviews.com", 
     "scores": { 
     "2015-09-26": 3.98, 
     "2015-09-27": 4.45, 
     "2015-09-28": 4.14, 
     "2015-09-29": 4.4, 
     "2015-09-30": 4.36, 
     "2015-10-01": 4.95, 
     "2015-10-02": 4.95, 
     "2015-10-03": 4.53, 
     "2015-10-04": 4.52, 
     "2015-10-05": 4.72, 
     "2015-10-06": 5.01, 
     "2015-10-07": 4.82, 
     "2015-10-08": 4.67, 
     "2015-10-09": 4.66, 
     "2015-10-10": 4.91, 
     "2015-10-11": 4.87, 
     "2015-10-12": 4.75, 
     "2015-10-13": 4.78, 
     "2015-10-14": 5.15, 
     "2015-10-15": 4.83, 
     "2015-10-16": 4.75, 
     "2015-10-17": 5.04, 
     "2015-10-18": 5, 
     "2015-10-19": 5.05, 
     "2015-10-20": 5.04, 
     "2015-10-21": 5.13, 
     "2015-10-22": 5.57, 
     "2015-10-23": 5.38, 
     "2015-10-24": 5.18, 
     "2015-10-25": 5.26 
     } 
    }, 
    { 
     "domain": "gsmarena.com", 
     "scores": { 
     "2015-09-26": 4.43, 
     "2015-09-27": 4.31, 
     "2015-09-28": 4.14, 
     "2015-09-29": 4.48, 
     "2015-09-30": 4.41, 
     "2015-10-01": 4.35, 
     "2015-10-02": 4.48, 
     "2015-10-03": 4.41, 
     "2015-10-04": 4.4, 
     "2015-10-05": 4.46, 
     "2015-10-06": 4.26, 
     "2015-10-07": 4.65, 
     "2015-10-08": 4.49, 
     "2015-10-09": 4.79, 
     "2015-10-10": 4.76, 
     "2015-10-11": 4.68, 
     "2015-10-12": 4.69, 
     "2015-10-13": 4.5, 
     "2015-10-14": 4.51, 
     "2015-10-15": 4.78, 
     "2015-10-16": 4.5, 
     "2015-10-17": 4.59, 
     "2015-10-18": 4.75, 
     "2015-10-19": 4.8, 
     "2015-10-20": 4.67, 
     "2015-10-21": 4.58, 
     "2015-10-22": 4.91, 
     "2015-10-23": 4.92, 
     "2015-10-24": 4.8, 
     "2015-10-25": 4.76 
     } 
    }, 
    { 
     "domain": "wikipedia.org", 
     "scores": { 
     "2015-09-26": 4.57, 
     "2015-09-27": 4.55, 
     "2015-09-28": 4.51, 
     "2015-09-29": 4.54, 
     "2015-09-30": 4.39, 
     "2015-10-01": 4.57, 
     "2015-10-02": 4.48, 
     "2015-10-03": 4.47, 
     "2015-10-04": 4.42, 
     "2015-10-05": 4.3, 
     "2015-10-06": 4.64, 
     "2015-10-07": 4.78, 
     "2015-10-08": 4.61, 
     "2015-10-09": 4.62, 
     "2015-10-10": 4.93, 
     "2015-10-11": 4.74, 
     "2015-10-12": 4.56, 
     "2015-10-13": 4.65, 
     "2015-10-14": 4.62, 
     "2015-10-15": 4.64, 
     "2015-10-16": 4.62, 
     "2015-10-17": 4.5, 
     "2015-10-18": 4.66, 
     "2015-10-19": 4.53, 
     "2015-10-20": 4.5, 
     "2015-10-21": 4.48, 
     "2015-10-22": 4.37, 
     "2015-10-23": 4.59, 
     "2015-10-24": 4.57, 
     "2015-10-25": 4.54 
     } 
    }, 
    { 
     "domain": "argos.co.uk", 
     "scores": { 
     "2015-09-26": 1.97, 
     "2015-09-27": 2.11, 
     "2015-09-28": 1.79, 
     "2015-09-29": 2.08, 
     "2015-09-30": 1.86, 
     "2015-10-01": 2.08, 
     "2015-10-02": 1.95, 
     "2015-10-03": 2.15, 
     "2015-10-04": 1.83, 
     "2015-10-05": 1.81, 
     "2015-10-06": 2.09, 
     "2015-10-07": 1.82, 
     "2015-10-08": 1.87, 
     "2015-10-09": 2.25, 
     "2015-10-10": 2.24, 
     "2015-10-11": 2.15, 
     "2015-10-12": 2.31, 
     "2015-10-13": 2.43, 
     "2015-10-14": 2.29, 
     "2015-10-15": 2.17, 
     "2015-10-16": 2.38, 
     "2015-10-17": 2.3, 
     "2015-10-18": 2.16, 
     "2015-10-19": 2.14, 
     "2015-10-20": 2.39, 
     "2015-10-21": 2.18, 
     "2015-10-22": 2.09, 
     "2015-10-23": 2.12, 
     "2015-10-24": 2.33, 
     "2015-10-25": 2.32 
     } 
    }, 
    { 
     "domain": "o2.co.uk", 
     "scores": { 
     "2015-09-26": 2.81, 
     "2015-09-27": 2.98, 
     "2015-09-28": 2.85, 
     "2015-09-29": 3.1, 
     "2015-09-30": 2.92, 
     "2015-10-01": 2.9, 
     "2015-10-02": 2.63, 
     "2015-10-03": 2.9, 
     "2015-10-04": 2.67, 
     "2015-10-05": 2.63, 
     "2015-10-06": 2.75, 
     "2015-10-07": 2.74, 
     "2015-10-08": 2.75, 
     "2015-10-09": 2.77, 
     "2015-10-10": 2.62, 
     "2015-10-11": 2.75, 
     "2015-10-12": 2.86, 
     "2015-10-13": 2.88, 
     "2015-10-14": 2.91, 
     "2015-10-15": 2.86, 
     "2015-10-16": 2.85, 
     "2015-10-17": 2.96, 
     "2015-10-18": 2.87, 
     "2015-10-19": 2.78, 
     "2015-10-20": 2.71, 
     "2015-10-21": 2.76, 
     "2015-10-22": 2.58, 
     "2015-10-23": 2.4, 
     "2015-10-24": 2.34, 
     "2015-10-25": 2.31 
     } 
    } 
    ] 
} 

Много apriciated для каких-либо указателей

+0

Где 'dates'? ?? – Manwal

+0

@Manwal только что обновил вопрос – BoyIsBadNews

ответ

-1

На самом деле вы хотите получить key и value объекта

HTML Попробуйте следующее:

<div data-ng-controller="customersCtrl"> 
    <ul> 
     <li data-ng-repeat="x in ayima"> 
     <p>{{ x.domain }}</p> 
     <p ng-repeat="(key, value) in x.scores">{{key}},{{value}}</p> 
     </li> 
    </ul> 
    </div> 

См DEMO

+0

Downvoter добавить комментарий здесь. И проверьте, работает это или нет. – Manwal

+0

Обновленный ответ, добавив демо. – Manwal

-1

Это хорошо, если вы делаете это так:

<!DOCTYPE html> 
<html data-ng-app="myApp"> 

<head> 
    <meta charset="utf-8" /> 
    <title>AyimaData</title> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> 
</head> 

<body> 
    <div data-ng-controller="customersCtrl"> 
    <ul> 
     <li data-ng-repeat="x in ayima"> 
     <p>{{ x.domain }}</p> 
     <p ng-repeat="(key,value) in x.scores">{{key}}</p> 
     </li> 
    </ul> 
    </div> 
    <script> 
    var app = angular.module('myApp', []); 
    app.controller('customersCtrl', function($scope, $http) { 
     $http.get("http://dfjb.webcindario.com/dataAyima.php") 
     .success(function(response) { 
      $scope.ayima = response.marketIntel; 

     }) 
     .error(function(data, status, headers, config) { 
      // something went wrong 
     }); 
    }); 
    </script> 
</body> 

</html> 

Резюмируя:

Вы должны использовать

ng-repeat="(key,value) in x.scores" 

, а затем вызвать

{{key}} 

, который дату.

Вот Plunker

0

Я бы преобразовать оригинальный JSON, чтобы держать вещи ясно и проще в стороне angularjs ....

$http.get("http://dfjb.webcindario.com/dataAyima.php") 
    .success(function(response) { 
     var transformedMarketIntel = response.marketIntel.map(function(market){ 
     var scoreObjs = []; 
     for (var date in market.scores) { 
      scoreObjs.push({date: date, score: market.scores[date]}); 
     } 
     return { 
      domain: market.domain, 
      scores: scoreObjs 
     }; 
     }); 
     $scope.ayima = transformedMarketIntel; 
    }) 

, а затем использовать регулярную и более четкую форму директивы:

<p ng-repeat="score in x.scores">{{score.date}}</p> 
Смежные вопросы