AngularJS-http获取响应（JSON数组）并以html显示

Question

我已经用Java创建了一个servlet，它使用来显示数组。

    printWriter.println(jsonarray);

数组显示在servlet页面上，但这就是乐趣的所在。 我想使用AngularJS将数组显示为网页上的表格，我以前没有经验。 但是我无法让数组显示在网页上，更不用说将其显示为表格了

的HTML

    <div ng-app="myApp" ng-controller="myController">{{myArray}}</div>

AngularJS

var app = angular.module("myApp", []);

app.controller("myController", function($scope, $http)
{
    $scope.recipes = null;
    $scope.message = null;
    $scope.filterString = '';
    $scope.sortByName = false;
    $scope.sortOrder = '';
    $scope.setSortOrder = function()
    {
        if($scope.sortByName)
        {
            $scope.sortOrder = 'name';
        }
        else
        {
            $scope.sortOrder = '';
        }
    }


    var connection = $http(
    {
        method: 'GET',
        url: 'http://localhost:8080/students'
    })


    .then(function(response)
    {
        $scope.myArray = response.data;
    })
    .catch(function(response)
    {
        // It is OK not to take any action here because it would be
        // clear to the user if the list operation is succesfull or not
    })

    .finally(function(config)   // induce a syntax error here and see what happens
    {
        // It is OK not to take any action here because it would be
        // clear to the user if the list operation is succesfull or not
    });


});
//end controller

好的，修复了一些小错误，但是现在我遇到了404文件未找到的错误

http://localhost:8080/students

当我在浏览器中访问链接时，我得到了显示的数组，但是网页给了我；

404错误图片

更改angular.js版本可修复404，我之前的最低版本为1.4.8

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.js"></script>

Answer 1

尝试：

<div ng-app="myApp" ng-controller="myController"> 

  <table>
    <tr ng-repeat="x in myArray">
      <td>{{ x.name }}</td>
      <td>{{ x.age }}</td>
    </tr>
  </table>

</div>

Answer 2

尝试ng-repeat指令。

ng-repeat指令以给定的次数重复一组HTML。

每个集合中的每个项目都会重复一次HTML设置。

集合必须是array或object 。

句法 ：

<div ng-repeat="item in myArray"></div>

根据您的要求回答：

<div ng-app="myApp" ng-controller="myController"> 
  <table>
    <tr>
      <td>Name</td>
      <td>Age</td>
    </tr>
    <tr ng-repeat="item in myArray">
      <td>{{::item.name}}</td>
      <td>{{::item.age}}</td>
    </tr>
  </table>
</div>

就您遇到的第二个问题而言，您传递给ajax调用的URL似乎无效。

404代码表示服务器无法通过GET或POST请求找到您要查找的文件。