css - angularjs + 嵌套 ng-form + $invalid css for main ng-form.$invalid

Question

我需要在最外面的 ng-form 上设置一个 css 类，如果对于任何孩子，孙子 ng-form，$invalid 是真的。

我有一个 plunker 来检查这个问题。

有人试过吗？任何指针？

谢谢。

score 1 · Accepted Answer

表单元素也有一个 ng-invalid 类，所以这在 CSS 中有效——你甚至不需要实现自己的error类：

form.ng-invalid {
   border: 1px solid red;
}

填满所有输入后，边框将消失。

score 1 · Accepted Answer

你的 CSS 不正确。

您需要添加border-style：

.error{
    border-color: red;
    border-width: 1px;
    border-style: solid;
}

好消息？您对 Angular 的理解是正确的！Angular 无需任何配置即可支持您想要的东西。

在 Angular 表单中可以嵌套。这意味着当所有子表单都有效时，外部表单也有效。

2 回答 2