无法使用 angularjs、HTML 和 REST 打印表格答案

【问题标题】：Can't print table with angularjs, HTML and REST无法使用 angularjs、HTML 和 REST 打印表格
【发布时间】：2016-01-21 23:36:34
【问题描述】：

我对问题中提到的技术很陌生。尝试使用它们生成表。目前，我可以从浏览器获取表格的 json 格式，但即使在控制台中也无法打印（在.js 文件中）。这里的原因是什么？

HTML：

<!doctype html>
<html data-ng-app>
<head>
<title>Book</title>
 <script src="index.js"></script>
 </head>
  <body background="/images/library-wall.jpg">

    <center>
   <div data-ng-app="bookApp">
    <div data-ng-controller="bookListCtrl">
        <table border = "1">
            <tr>
                <th>#</th>
                <th color = "#0000FF">Title</th>
                <th>Author</th>
                <th>ISBN</th>
                <th>Brief Description</th>
                <th>Location</th>
            </tr>
            <tr data-ng-repeat="book in books">
                <td>{{book.id}}</td>
                <td>{{book.title}}</td>
                <td>{{book.author}}</td>
                <td>{{book.isbn}}</td>
                <td>{{book.description}}</td>
                <td>{{book.location}}</td>
            </tr>
        </table>
    </div>
</div>

JS：

var booksApp = angular.module('booksApp', []);
books.controller('bookListCtrl', function($scope, $http) {  
$http.get('books').success(function(data) {
    console.log(data);
    $scope.books = data;
});
});

REST：

@RequestMapping(value = "/books", method = RequestMethod.GET)
ResponseEntity<Collection<Book>> allOffices() {
    return new ResponseEntity<Collection<Book>>(bookRepository.findAll(),
            HttpStatus.OK);
}

【问题讨论】：

您确定 REST 返回任何数据吗？您是否尝试过打印一些字符串而不是响应值？
我在浏览器中打印了这些值，效果很好。
数据呢？你能验证服务返回数据吗？
@RaufAgayev 请写完整的 html 文件。

标签： javascript java html angularjs

【解决方案1】：

每个 HTML 只能自动引导一个 AngularJS 应用程序文档。在文档中找到的第一个 ngApp 将用于定义作为应用程序自动引导的根元素。运行多个 HTML 文档中的应用程序，您必须手动引导它们改用 angular.bootstrap 。 AngularJS 应用程序不能相互嵌套。

http://docs.angularjs.org/api/ng.directive:ngApp

试试：

<!doctype html>
<html>
<head>
<title>Book</title>
 <script src="index.js"></script>
 </head>
  <body background="/images/library-wall.jpg">

    <center>
   <div data-ng-app="bookApp">
    <div data-ng-controller="bookListCtrl">
        <table border = "1">
            <tr>
                <th>#</th>
                <th color = "#0000FF">Title</th>
                <th>Author</th>
                <th>ISBN</th>
                <th>Brief Description</th>
                <th>Location</th>
            </tr>
            <tr data-ng-repeat="book in books">
                <td>{{book.id}}</td>
                <td>{{book.title}}</td>
                <td>{{book.author}}</td>
                <td>{{book.isbn}}</td>
                <td>{{book.description}}</td>
                <td>{{book.location}}</td>
            </tr>
        </table>
    </div>
</div>

【讨论】：

【解决方案2】：

var booksApp = angular.module('booksApp', []);
books.controller('

不应该是booksApp.controller吗？

【讨论】：

好的，console.log(data) 有效吗？你能发布它的输出吗？
console.log(data) 不打印任何内容。我认为问题与 html 部分有关：/
好的，这可能是您的 Web 服务的问题，如果您使用 Angular 以外的其他方式调用它，它会起作用吗？
好的，在 Chrome 开发控制台的网络选项卡中，您是否看到对您的网络服务的调用？如果你用控制器中的手写数组替换 $scope.books，它会起作用吗？

【解决方案3】：

如何检查我的网络服务和它们正在运行的网页：

首先，使用Postman 通过GET 方法向Web 服务发送请求。如果收到响应，则表示成功。

其次，查找 angularjs 文档找到您的错误。假设您的网络服务的主机是http://127.0.0.1:5000，请将url 设置为http://127.0.0.1:5000/books。

请确保客户端和服务器端能够正常工作。

【讨论】：