AngularJS和用户界面 - 无法在标签内部访问表单外部

我使用AngularJS版本1.0.5和Angular UI（Bootstrap）0.4.0。我想集成2个功能：UI的选项卡和Angular的形式。AngularJS和用户界面 - 无法在标签内部访问表单外部

我有嵌套窗体。一种形式（outerForm）包装整个标签集。另一种形式（innerForm）驻留在一个选项卡中。

我想要一个按钮，在选项卡之外，根据innerForm的有效性启用\禁用！

当我尝试从表单本身外部访问innerForm。$ valid时，它不起作用。

这里是一个plunker： http://plnkr.co/edit/sEz8TG?p=preview

现在，当我尝试定期引导一样，它似乎工作： http://plnkr.co/edit/Somic4?p=preview

当内部形式驻留在常规的DIV内，我可以从外面访问它。当我使用Angular UI的特殊'tab'语法时，它不再起作用。

来源

2013-06-26 Daniel Wolf

tabset指令生成的本地范围不属于您的外部表单范围。

https://github.com/angular-ui/bootstrap/blob/master/src/tabs/tabs.js#L78

在该不工作的示例中，您的内和外形式的属性是相同的范围内。为了证明这一点，我删除了外部标签集和标签标签指令show here，它的工作原理。当用tabset指令包围标记时，会生成一个新的隔离范围，innerForm是其中的一部分。
。

为了解决这个问题，您可以在表单中进行$ watch的更改，后跟$ emit（）（http://docs.angularjs.org/api/ng。$ rootScope.Scope），以便与内部作用域的外部范围通信并更改值和有效性。

如果您使用的是Chrome，得到了Batarang extension它会告诉你你的范围层次结构

来源

2013-06-26 18:37:20 mitch

此外，还要确保你升级到最新的角度引导。 https://github.com/angular-ui/bootstrap/issues/574标签编译被修复，这导致了我们在标签内部的表单元素上出现奇怪行为时遇到的几个问题。 –

另一种选择是将“form”对象本身的容器移动，如下所示：http://stackoverflow.com/questions/19568761/can-i-access-a-form-in-the-controller。如果你只是寻找一种简单的方式从基本控制器访问表单，尽管tabset - 这是最简单的选项。 –

AngularJS和用户界面 - 无法在标签内部访问表单外部

回答

相关问题