表未在angularjs中綁定

Question

大家好，我正在嘗試綁定angulajs中的表。我從表中的數據庫獲取數據並試圖填充該表。 在這裏，我做了

$scope.getPageDetails = function() { 
    $http.get('/api/privilege/getpagedetails/') 
     .success(function (data, status) { 
      $scope.Page = data; 
      console.log($scope.Page); 
     }).error(function() { 
     }); 
} 

然後我得到它被定義爲$scope.Page = [];在這裏$ scope.Page數據我附上我在$ scope.page獲取數據

這裏的控制檯圖像是我的表

<table class="table table-bordered table-hover"> 
        <thead> 
         <tr> 
          <th> 
           ID 
          </th> 

          <th> 
           PageName 
          </th> 

          <th> 
           PageUrl 
          </th> 
         </tr> 
        </thead> 
        <tbody> 
         <tr ng-repeat="Page in Pages"> 
          <td>{{Page.id}}</td> 
          <td>{{Page.pageName}}</td> 
          <td>{{Page.pageUrl}}</td> 
          <td> 
           <input type="checkbox" value="Edit" /> 
          </td> 
         </tr> 
        </tbody> 
       </table> 

請幫助我失蹤的地方我將非常感謝大家。

Answer 1

在您的觀點中，您正在迭代Pages，但我沒有看到它在您的控制器中定義。

變化

$scope.Page = data; 

到

$scope.Pages = [data]; 

終極密碼 HTML：

<table class="table table-bordered table-hover"> 
       <thead> 
        <tr> 
         <th> 
          ID 
         </th> 

         <th> 
          PageName 
         </th> 

         <th> 
          PageUrl 
         </th> 
        </tr> 
       </thead> 
       <tbody> 
        <tr ng-repeat="Page in Pages"> 
         <td>{{Page.id}}</td> 
         <td>{{Page.pageName}}</td> 
         <td>{{Page.pageUrl}}</td> 
         <td> 
          <input type="checkbox" value="Edit" /> 
         </td> 
        </tr> 
       </tbody> 
      </table> 

控制器：

$scope.getPageDetails = function() { 
$http.get('/api/privilege/getpagedetails/') 
    .success(function (data, status) { 
     $scope.Pages = [data]; 
    }).error(function() { 
    }); 

}

編輯：如果你的數據是一個對象，使其成爲一個數組，所以NG-重複，可以遍歷它

Answer 2

$scope.Page在控制器VS在你的HTML NG重複Pages結合，你需要寫$scope.Pages :)

Answer 3

變化$scope.Page = data到$scope.Pages = data。

Answer 4

$scope.getPageDetails = function() { 
    $http.get('/api/privilege/getpagedetails/') 
     .success(function (data, status) { 
      $scope.Pages = data; //change page to pages in whole code, 
           //no need to change any thing in html page 
      console.log($scope.Pages); 
     }).error(function() { 
     }); 
}