Javascript 为multilple获取多个Angular.js控制器<；td>；在相同的范围内<；tr>；_Javascript_Angularjs_Google Chrome_Ng Controller

Javascript 为multilple获取多个Angular.js控制器<；td>；在相同的范围内<；tr>；

javascript angularjs google-chrome

Javascript 为multilple获取多个Angular.js控制器<；td>；在相同的范围内<；tr>；,javascript,angularjs,google-chrome,ng-controller,Javascript,Angularjs,Google Chrome,Ng Controller,我试图在同一个tr标记中添加多个角度控制器，问题是chrome重写了表以使其标准化，并且在HTML表层次结构中tr和td之间没有任何元素这是我目前拥有的，每种颜色代表一个不同的控制器来调用。最终目标是创建一个如下表，其中一个或多个td使用不同的控制器，而不是多个TR 我知道我可以使用一个全局控制器来处理所有数据，或者使用多个具有固定宽度的div元素来实现这一点，但我更喜欢使用一个tr表代码如下： <table> <tr> <div n

我试图在同一个tr标记中添加多个角度控制器，问题是chrome重写了表以使其标准化，并且在HTML表层次结构中tr和td之间没有任何元素

这是我目前拥有的，每种颜色代表一个不同的控制器来调用。最终目标是创建一个如下表，其中一个或多个td使用不同的控制器，而不是多个TR

我知道我可以使用一个全局控制器来处理所有数据，或者使用多个具有固定宽度的div元素来实现这一点，但我更喜欢使用一个tr表

代码如下：

<table>
    <tr>
        <div ng-controller="testController">
            <td>{{testcontrollerscopevalue}}</td> <!-- empty when displayed -->
            <td>{{testcontrollerscopevalue2}}</td> <!-- empty when displayed -->
            <td>{{testcontrollerscopevalue3}}</td> <!-- empty when displayed -->
        </div>
        <div ng-controller="testController2"> 
            <td>{{testcontroller2scopevalue}}</td> <!-- empty when displayed -->
        </div>
    </tr>
</table>


{{testcontrollerscopevalue}}
{{testcontrollerscopevalue2}}
{{testcontrollerscopevalue3}
{{testcontroller2scopevalue}}

以下工作：

 <table ng-controller="testController">
        <tr>
            <td>{{testcontrollerscopevalue}}</td> <!-- set when displayed-->
        </tr>
    </table>


{{testcontrollerscopevalue}}

以下是chrome生成的内容：

<body>
<div ng-controller="testController"></div>
<div ng-controller="testController2"></div>
<table>
    <tbody>
    <tr>
        <td>{{testcontrollerscopevalue}}</td> <!-- out of scope-->
        <td>{{testcontrollerscopevalue2}}</td> <!-- out of scope-->
        <td>{{testcontrollerscopevalue3}}</td> <!-- out of scope-->
        <td>{{testcontroller2scopevalue1}}</td> <!-- out of scope-->
    </tr>
    </tbody>
</table>


{{testcontrollerscopevalue}}
{{testcontrollerscopevalue2}}
{{testcontrollerscopevalue3}
{{testcontroller2scopevalue1}}


{{testcontrollerscopevalue}}

我有什么办法可以做到这一点吗？有没有什么标签可以代替div来让它工作？

谢谢，

您可能应该：

<td ng-controller="testController2">{{testcontrollerscopevalue}}</td>

正如我们在中详细讨论的，在这种情况下，最好使用ControllerAs语法，并将

元素包装在包含每个控制器逻辑的多个

元素中

我的建议类似于以下代码：


{{tc1.testcontrollervalue}}
{{tc1.testcontrollervalue2}
{{tc1.testcontrollervalue3}
{{tc2.testcontroller2value1}

为什么一个表体需要两个控制器？你试图解决的真正问题是什么？更新（带有模糊的屏幕截图）并不能真正解释为什么你试图显示来自多个不同控制器的数据；但是，如果您的设计中唯一的选择是，每个“组件”都有自己的控制器，那么您应该考虑将每个指令都指定为一个指令。为什么不将一个控制器中的范围变量从多个服务中更新？当然，您可以嵌套控制器，但是除非您使用ControlRas语法，您将无法分辨哪个范围是哪个范围。此外，正如我前面提到的，您可以创建具有其模板特有的控制器的指令，尽管我不确定这是否可以克服分散的数据。总之，您试图通过将

作为

中的元素来做的事不是受支持的HTML构造，所以这真的不会是一个有固定角度的东西，而且它不仅仅影响chrome。谢谢！我编辑了这篇文章，目的是能够为一个或多个tds提供一个控制器。

<td ng-controller="testController2">{{testcontrollerscopevalue}}</td>

<td><div ng-controller="testController2">{{testcontrollerscopevalue}}</div></td>