无法读取未定义的属性$valid

Question

我有这样的表格-

<form name="myForm" novalidate>

表单中有一些字段，我正在验证然后提交这样的表单 -

<input type="button" ng-click="Save(data)" value="Save">

在控制器中，我想检查表单是否无效，然后Save()页面上显示一些错误。为此，我正在设置这样的手表 -

$scope.$watch('myForm.$valid', function(validity) {
     if(validity == false)
        // show errors
});

但是我在运行它时总是收到此错误 -

Cannot read property '$valid' of undefined

有人可以解释为什么吗？

谢谢

Answer 1

你只是在控制器代码中拼错了"myForm"。为了消除错误，请编写"myform"而不是"myForm"。

但是我希望你想要的是这样的。

$scope.Save = function(data){
    alert($scope.myform.$valid);
}

我设置了jsfiddle。

Answer 2

就我而言，我将表单包装在控制器中创建的模式中，因此遇到了相同的错误。我用：

.HTML

<form name="form.editAddress" ng-submit="save()">
    <div class="form-group">
        <label for="street">Street</label>
        <input name="street" type="text" class="form-control" id="street" placeholder="Street..." ng-model="Address.Street" required ng-minlength="2" />
        <div class="error" ng-show="form.editAddress.street.$invalid">
           <!-- errors... -->
        </div>
    </div>
    <button type="submit" class="btn btn-primary" >Save address</button>
</form>

.JS

angular.module("app").controller("addressController", function ($scope, $uibModal, service) {
    $scope.Address = {};
    $scope.form = {};
    $scope.save = function() {
        if (modalInstance !== null) {
            if (isValidForm()) {
                modalInstance.close($scope.Address);
            }
        }
    };
    var isValidForm = function () {
        return $scope.form.editAddress.$valid;
    }
});