使用AngularJS在div元素中顯示錶格的行

我有一個數據庫表，其中有許多行，每個行都有5個字段。然後我有一個<div>元素，我想在其中顯示一行的字段。什麼是從我的表中檢索行並使用div顯示行的字段的最佳方式是什麼？使用AngularJS在div元素中顯示錶格的行

目前我有一個服務，檢索表中的所有行，一個控制器，調用上述服務，並在控制器我有每個行的字段。這就是我的意思：

// service 
... 
     getTableRows: function(callback) { 
     $http.post('../php/getTableRows.php') 
      .success(function(data, status, headers, config) { 
      callback(data); 
      }) 
      .error(function(errorData) { 
      console.log("error: " + errorData); 
      }); 
     } 

// controller 
... 
myService.PHP.getTableRows(function(getTableRowsResponse){ 
    // getTableRowsResponse contains all of my rows in the table in an array 
    //getTableRowsResponse[0].name; 
    //getTableRowsResponse[0].ID; 
    //getTableRowsResponse[0].age; 
    //getTableRowsResponse[0].department; 
    //getTableRwosResponse[0].imageurl; 
}); 

// view 
... 
    <div class="widget"> 
    //how do I access the fields here? 
    </div>

來源

2015-06-02 izik

您可以將行響應設置爲控制器作用域，然後在視圖中訪問它。在視圖中，您可以使用angularJS ng-repeat指令遍歷表響應中的所有記錄並呈現所需的數據。

的js

myService.PHP.getTableRows(function(getTableRowsResponse){ 
    // getTableRowsResponse contains all of my rows in the table in an array 
    $scope.tableResponse = getTableRowsResponse; 
});

查看

<div class="widget" ng-repeat="row in tableResponse"> 
     <!-- Render the UI however you want --> 
     Name: {{row.name}} 
     Age: {{row.age}} 
     ... 
     ... 
    </div>

來源

2015-06-02 18:53:07 ShankarSangoli

以下是我已經爲我的情況

 <div> 
    <table> 
     <thead> 
      <tr> 
       <th>Total Price</th> 
       <th>Status</th> 
      </tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="d in data"> 
       <td>{{d.price}}</td> 
       <td>{{d.status}}</td> 
      </tr> 
     </tbody> 
    </table> 
    </div>

您可以對應你的情況的變化來實現。

來源

2015-06-02 18:57:50

使用AngularJS在div元素中顯示錶格的行

回答

相關問題