Question

我正在尝试从URL中读取json数据，但是它不起作用。

This is how the json url look like（如果chrome不起作用，请在Firefox中打开它。）

这是我的JavaScript代码：

$scope.displayA = function() {
  $http.get('url').then(function(response){
    $scope.ninjass = response.data;
  });
};

我正在尝试以ng-repeat格式显示它，但是什么也没显示。

ng-repeat代码

    <table>
      <!--  <th ng-repeat="ninja in ninjass">
             {{ ninja.id }}
        </th> -->
        <tbody>
            <tr ng-repeat="ninja in ninjass">
                <td>{{ ninja.name }}</td>
                <td>{{ ninja.description }}</td>
              <!--  <td>
                  {{ ninja.NAME }}
                </td>
                <td>{{ ninja.NAME }}</td> -->
            </tr>
        </tbody>
    </table>

错误日志：

未捕获的SyntaxError：意外令牌]

还有

未捕获的错误：[$ injector：modulerr]

Answer 1

我在您的代码中检测到很少的错误。首先，它应该是不带''的url；并且必须在上面声明。第二件事$ scope.ninjass应该在代码之上。被计为全局变量。第三件事，您需要在get调用中访问“ SrchResults”属性。

$scope.ninjass = response.data.SrchResults;

总共应该是这样的。

var url = //put your url here;
$scope.ninjass = [];
$scope.displayA = function() {
  $http.get(url).then(function(response){
    $scope.ninjass = response.data.SrchResults;
  });

};

Answer 2

尝试一下，

$http({
  method: 'GET',
  url: '/someUrl'
}).then(function successCallback(response) {
  console.log(response.data);
}, function errorCallback(response) {
  console.log(response);
});

您必须用url api替换'/ someUrl'。

Answer 3

尝试这个

$scope.displayA = function() {  
   $http.get('url').then(function(response){    
         console.log("success :- "+JSON.stringify(response.data));
         $scope.ninjass = response.data.SrchResults;
         console.log("total length :- "+$scope.ninjass.length); 
  }); 
};

Answer 4

您应该全局定义$scope.ninjass=[];。除非由于模型对象未定义而导致ng-repeat throw错误。请检查以下代码段；

angular.module("test",[]).controller("testc",function($scope,$http) {   
$scope.ninjass=[];       

 $http.get('https://developers.onemap.sg/publicapi/themeapi/retrieveTheme?queryName=historicsites&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOjMsInVzZXJfaWQiOjMsImVtYWlsIjoicHVibGljQXBpUm9sZUBzbGEuZ292LnNnIiwiZm9yZXZlciI6ZmFsc2UsImlzcyI6Imh0dHA6XC9cL29tMi5kZmUub25lbWFwLnNnXC9hcGlcL3YyXC91c2VyXC9zZXNzaW9uIiwiaWF0IjoxNTM3ODYwNTIxLCJleHAiOjE1MzgyOTI1MjEsIm5iZiI6MTUzNzg2MDUyMSwianRpIjoiNmVhNzA3NTk5OWM1NGZlZjQ0ZDFkMzEyZTkyMmEzMmUifQ.q_MiRnCT_2owbMFfCcpVVSECOTellwvojAY5Wwz0xJY').then(function(response){
     $scope.ninjass = response.data.SrchResults;
  });
 });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="test" ng-controller="testc">
    <table>     
    <tbody>
        <tr ng-repeat="ninja in ninjass">
            <td><b>{{ ninja.NAME}}<b/></td>
            <td>{{ ninja.DESCRIPTION}}</td>  
        </tr>
    </tbody>
</table>
</div>

AngularJS JSON数据读取

4 个答案: