打印JSON的用户ID使用角度

  • Z时代
  • 2024-01-10
  • 分类：问答

我想打印用户JSON文件只是ID {{item.id}}，但它不工作，我不明白问题出在哪里。我认为这个问题是在$http.get(urls).then()但，但我不知道我怎样才能修复这个。打印JSON的用户ID使用角度

如果我写这样{{项目}}它将工作。

var app = angular.module("myApp", []);  
app.controller("controller", function($scope, $http) {  
    var url = "https://jsonplaceholder.typicode.com/users";  
    $http.get(urls).then(function(response) {  
    $scope.users = response;  
    });  
});

<!DOCTYPE html>  
<html lang="en" ng-app="myApp">  
<head>  
    <meta charset="utf-8">  
    <title>AngularJa | app</title>  
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>  
    <script type="text/javascript" src="javascript/main.js"></script>  
</head>  
<body ng-controller="controller">  
    <table class="table table-striped">  
    <tr ng-repeat="item in users">  
     <td>{{item.id}}</td>  
    </tr>  
    </table>  
</body>  
</html>

回答：

变化urls到url和数据是响应对象的属性，并命名为data

var app = angular.module("myApp", []);  
app.controller("controller", function($scope, $http) {  
    var url = "https://jsonplaceholder.typicode.com/users";  
    $http.get(url).then(function(response) {  
      //^^ remove "s"  
    $scope.users = response.data;  
         // ^^ add data property  
    });  
});

<!DOCTYPE html>  
<html lang="en" ng-app="myApp">  
<head>  
    <meta charset="utf-8">  
    <title>AngularJa | app</title>  
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>  
    <script type="text/javascript" src="javascript/main.js"></script>  
</head>  
<body ng-controller="controller">  
    <table class="table table-striped">  
    <tr ng-repeat="item in users">  
     <td>{{item.id}} - {{item.name}}</td>  
    </tr>  
    </table>  
</body>  
</html>

以上是 打印JSON的用户ID使用角度 的全部内容， 来源链接： utcz.com/qa/258562.html

回到顶部