ng-repeat在表格中生成空行

我正嘗試使用angularjs，MVC和web-API創建單個頁面應用程序。我正在使用「ng-repeat」來顯示錶中的所有記錄，但它正在生成空白行。空白行的數量等於數據庫中的記錄數量。 API工作正常。另外當我打印$ scope.Students變量時，我可以在控制檯中看到數據。據ng-repeat在表格中生成空行

索引頁

<script src="~/Scripts/angular.min.js"></script> 
<script src="~/Scripts/angular-route.min.js"></script> 
<script src="~/MyScripts/script.js"></script> 

<h2>Home Page</h2> 

<body ng-app="appModule"> 
    <div> 
     <br /> 
     <a href="/#!/display">Read</a> &nbsp;&nbsp; 
     <a href="/#!/create">Create</a> &nbsp;&nbsp; 
     <a href="/#!/delete">Delete</a> &nbsp;&nbsp; 
     <br /> 
     <ng-view></ng-view> 
     <br /> 
    </div> 
</body>

HTML顯示

<br /> 
{{message}} 
<br /><br /> 
<table border="1"> 
    <thead> 
     <tr> 
      <td> 
       ID 
      </td> 
      <td> 
       Name 
      </td> 
      <td> 
       City 
      </td> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="Student in Students"> 
      <td> 
       {{ Student.StudentID }} 
      </td> 
      <td> 
       {{ Student.Name }} 
      </td> 
      <td> 
       {{ Student.City }} 
      </td> 
      <td> 
       <input type="button" value="Edit" ng-click="" /> 
      </td> 
      <td> 
       <input type="button" value="Delete" ng-click="" /> 
      </td> 
     </tr> 
    </tbody> 
</table> 
<br /><br /> 
{{ errorMessage }}

角控制器

.controller("DisplayController", function ($scope, appService) { 
       $scope.message = "Display Page"; 

       getAll(); 
       //method to call angular service 
       function getAll() { 
        //service call 
        var serviceCall = appService.getStudents(); 
        serviceCall.then(function (response) { 
         //store response data to scope variable 
         $scope.Students = response.data; 
         console.log($scope.Students) 
        }, 
        function (error) { 
         $scope.errorMessage = error; 
        }) 
       } 
      })

View Page

來源

2017-06-06 lootfold

你可以複製一些在控制檯打印的數據嗎？ – tomek550

這是區分大小寫你的數據應該是，

<td> 
    {{ Student.studentID }} 
</td> 
<td> 
    {{ Student.name }} 
</td> 
<td> 
    {{ Student.city }} 
    </td>

來源

2017-06-06 07:13:12 Sajeetharan

等等，你是怎麼知道的...... – Icycool

你的圖像顯示它 – Sajeetharan

非常感謝！這是行得通的。但爲什麼這是一個較小的情況？我在表格中定義了「StudentID」，「Name」和「City」這兩列。 – lootfold

ng-repeat在表格中生成空行

回答

相關問題