javascript - 将页面数据加载到div中的最佳方式

Question

我的页面有两个 div，一个左 div，一个右 div。

在我左边的 div 中，我有一个表格，其中包含来 self 的数据库的数据行。我正在使用 ng-repeat 循环:

<tbody>
  <tr ng-repeat="box in boxar">
  <td>{{box.type}}</td>
  <td>{{box.mac}}</td>
  <td>{{box.serial}}</td>
  <td><a href="box.id">Remove</a> | <a href="box.id">-> customer</a> | <a href="box.id">History</a></td>
 </tr>

如您所见，我有属于行的链接。当我单击其中一个链接时，我想将页面/模板加载到正确的 div 中，其中包含属于我选择的框 (box.id) 的数据。

任何人都可以给我一个例子吗？

在 PHP 中，我会做这样的事情:

if(isset($_GET['box_id']))
{
  $query = "SELECT * FROM boxes WHERE box_id=$_GET['box_id']";
  //Print out the data from the selected box
}

Answer 1

希望这就是你想要的。

HTML:

....
<a ng-click='getId(box.id)'>Remove</a>
....
<div class="right-div">
   <ng-include src="template"></ng-include>
</div>

JS:

$scope.getId = function(id){
  $scope.id = id; //Here you get your ID
  $scope.template = id; //Here you load the template, provided its a proper path
}