javascript - 似乎无法在 div-div 标签内执行 has-errors 操作？

Question

我正在使用 AngularJS 进行一些基本的表单验证。

这是到目前为止的代码:

<form name="myForm" id="form_id" method="post" novalidate>
    <div class="form-group">
        <label for="myField_input" class="col-sm-2 control-label">Field</label>
        <div class="col-sm-10" ng-class="{ 'has-error' : myForm.myField.$invalid && (myForm.myField.$dirty || submitted)}">
            <input type="text" class="form-control" name="myField" id="myField_input" placeholder="MyField" ng-model="myField" required>
        </div>
    </div>
</form>
<div class="form-group" ng-controller="AddPropertyController">
    <button class="btn btn-default col-md-4 col-sm-offset-5" ng-click="submitProperty()">Submit</button>
</div>

当您单击按钮时，在 Controller 中，$scope.subscribed = true;

当我有一个带有标签和输入的 div 标签时，这个 has-error 字段就会起作用。但是当 div 里面有一个 div 时，它似乎不再起作用了，我不知道该怎么办。

Answer 1

您的主要问题是当变量 subscribed 不在表单范围内时尝试访问该变量。

您仅将 Controller 包装在提交按钮周围，而不是表单的其余部分

更改 Controller 以包装整个表单并提交按钮可以解决该问题，因为 ng-class 可以使用 subscribed 变量