Question

我正在尝试从json文件将数据加载到我的角度模块中，而不是数据我得到了这个。

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

app.controller("myCtrl",function($scope, $http)
 {
   $http.get('bookData.json').then(function(response){

      $scope.books = response.data;
    });
 });

在我看来，数据显示为：

<body ng-controller="myCtrl">
     <div>{{"Book details"}}</div>
     <div>
       <table>
         <tr ng-repeat="x in books">
           <td>x.bookid</td>
           <td>x.author</td>
         </tr>
       </table>
     </div>
 <script data-require="angular.js@1.5.x" src="https://code.angularjs.org/1.5.8/angular.js" data-semver="1.5.8"></script>
    <script src="app.js"></script>
  </body>
</html>

但我得到的输出为：

   Book details

x.bookid    x.author
x.bookid    x.author
x.bookid    x.author
x.bookid    x.author

https://plnkr.co/edit/ZqcnwOKZUdUo5eDIdjlh?p=preview

Answer 1

您需要使用{{和}}包装逻辑，以便通过角度识别它。否则它将打印为纯文本。

e.g

<td>{{x.bookid}}</td>
<td>{{x.author}}</td>

Answer 2

<body ng-controller="myCtrl">
    <div>
        <H1>Book details</H1>
    </div>
    <div>
        <table>
            <tr ng-repeat="x in books">
                <td>{{x.bookid}}</td>
                <td>{{x.author}}</td>
            </tr>
        </table>

将数据从json文件加载到角度模块

2 个答案: