Tr 和 td 在有角度的表格中答案

【问题标题】：Tr and td's in table with angularTr 和 td 在有角度的表格中
【发布时间】：2014-10-09 03:44:03
【问题描述】：

我想用 tr's 和 td's 用 angular 循环填充表格。我用 PHP 用 tr 和 td 填充我的表：

for($j = 1; $j <= 8; $j++){
    echo "<tr>";
    for($i = 1; $i <= 20; $i++){    
        if($string[$k] == "#"){
            echo "<td id='$k'>#</td>";
        }elseif($string[$k] == "&"){
            echo "<td class='click' val='water' id='$k'>&</td>";
        }else{
            echo "<td class='click' id='$k'><a href='#'></a></td>";
        }
        $k++;
    }
    echo "</tr>";
}

我怎样才能使用 Angular 完成同样的事情？

【问题讨论】：

嘘，不支持不带 cmets 的投票。 OP 不会那样学习任何东西。

标签： javascript html angularjs html-table

【解决方案1】：

为了实现这一点，您需要在数组中有一个元素，这样您就可以使用 ng-repeat 来填充列表。看看这里Angular JS - ng-repeat and loop conditions

【讨论】：

【解决方案2】：

您的代码中描述的范例非常无角度。在您的代码中，您正在使用服务器端代码来组装标记。角度方法是使用服务器端代码将数据发送到客户端（通过 AJAX，或加载的内联 JSON 或 javascript），然后让 angular 组装标记。

有些人喜欢这种方法的原因有很多，但让我印象深刻的一个原因是：您可能会让 javascript 与此标记进行交互无论如何，但是 Angular 允许服务器不知道页面的交互行为。更好地分离关注点。

要更直接地回答您的问题，请执行以下操作（此处从臀部射击）：

<script>
myAngularApp.controller('MyController', ['$scope', function($scope) {
    $scope.myTableData = <?php echo $myTableJSON; ?>;
}]);
</script>

<table ng-controller="MyController">
    <tbody>
        <tr ng-repeat="row in myTableData">
            <td ng-repeat="cell in row">{{ cell.text }}</td>
       </tr>
   </tbody>
</table>

【讨论】：

【解决方案3】：

我建议您不要为此使用 Angular。 Angular 是更高级的框架。您应该将这种代码和平编写为独立的非角度模块，并使用 anular 的数据绑定指令进行包装。

【讨论】：