<div ng-controller> 在表内不起作用答案

【问题标题】：<div ng-controller> not working inside table<div ng-controller> 在表内不起作用
【发布时间】：2017-07-26 05:22:13
【问题描述】：

如果我将 div 元素放在内部 <tr> 块中，控制器将不起作用。我在这里做错了吗？我尝试通过卡在特定索引处的 chrome 进行调试

            <div ng-controller="ctrl3">
                            <tr>
                                <table cellspacing="0" cellpadding="0" style="">
                                    <tbody>

                              i want to place the controller here but it doesn't show the result
                                        <tr><td align="left"><table cellspacing="0" cellpadding="0" style="" class="celltable">

                                                <thead>
                                                    <!--change style of column with css-->
                                                    <col >
                                                    <col >
                                                    <col >
                                                    <col >
                                                    <col >
                                                    <tr>
                                                        <th colspan="1" ng-repeat="b in buildheadings" class="Header">{{b}}</th>

                                                    </tr>
                                                </thead>

                                                <tbody><!--display none-->
                                                    <!--onclick-->



                                                    <tr >

                                                        <td ng-repeat="case in cases">{{case}}</td>                                 


                                                    </tr>




                                                </tbody>

                                                </table>
                                            </td>
                                        </tr>
                                 </tbody>
                                </table>
                            </tr>
                    </div>

这是 javascript 代码..

                <script>
                analyzer.controller('ctrl3',function($scope){

                            $scope.featureheadings=['Feature','Total','Passed','Failed','Random'];
                            $scope.buildheadings=['Build','Total','Passed','Failed','Random'];
                        });

                </script>

另外，我可以对不同的块使用相同的控制器吗？

【问题讨论】：

但是如果你像在你的例子中那样将它设置为 div 是否有效？
是的，确实如此。 ...
必须是一张桌子吗？ display:table、display:table-cell 和 display:table-row（在 css 中）可以工作吗？
不，这只是我能想到的第一件事..

标签： html angularjs

【解决方案1】：

如果您将 multi ng-controller 放在任何表中，它仅适用于 1 个控制器，而不适用于第二个控制器。但是如果你删除 table 标签，所有控制器都会工作

【讨论】：

【解决方案2】：

div标签不能在tr标签上方使用。相反，您可以使用tbody 标签来完成您的工作。如果您打算将 id 属性赋予 div 标签并进行一些处理，则可以通过“tbody”标签实现相同的目的。 Div 和 Table 都是块级元素。所以它们不能嵌套。欲了解更多信息，请访问此页面：<div> into a <tr>: is it correct?

其次，你可以把“div”标签放在“td”标签里面。

<table>
  <tr>
    <td>
        <div></div>
    </td>
  </tr>
</table>

为了与控制器一起工作，最好将ng-controller 与table 标签或table 标签放在上面。

希望对你有帮助！

干杯！

【讨论】：

所以，如果我有一个 Lots of blocks inside ，我不能将 div 用于任何元素？
我想是的，但如果你想为ng-controller 设置div，我想你也可以设置tr 块。
不，不行，我试过了。如果您将 multi ng-controller 放在任何表格标签内，它仅适用于 1 个控制器，而不适用于第二个控制器。但是如果你删除 table 标签，所有的控制器都会工作。

【解决方案3】：

html 标记有问题。试试这个，

<table cellspacing="0" cellpadding="0" style="" ng-controller="ctrl3">
    <thead>
        <tr>
            <th colspan="1" ng-repeat="b in buildheadings" class="Header">{{b}}</th>
        </tr>
    </thead>
    <tbody>
        <tr >
            <td ng-repeat="case in cases">{{case}}</td>
        </tr>
    </tbody>
</table>

还有，

 angular.module('AppName', []).controller('ctrl3', function($scope) {
    $scope.featureheadings = ['Feature', 'Total', 'Passed', 'Failed', 'Random'];
    $scope.buildheadings = ['Build', 'Total', 'Passed', 'Failed', 'Random'];
    $scope.cases = ['one', 'two', 'three', 'four', 'five'];
 });

谢谢！

【讨论】：