Question

我有一个标记为必需的输入字段，如果用户触摸该字段但未提供值或表单已提交，则会显示验证消息。它很棒。

如果我以编程方式为字段设置值（例如使用JQuery），则仍会显示所需的消息。这是我的代码

<form
    name="myForm"
    novalidate>
    <input
        id="myField"
        name="myField"
        ng-model="myField"
        type="text"
        required />
    <br />
    <div
        ng-messages="myForm.myField.$error"
        ng-if="myForm.myField.$touched || myForm.$submitted">
        <div ng-message="required">Required field</div>
    </div>
    <br />
    <input
        type="submit"
        value="Send" />
</form>

<script>
    $(function() {
        $('#myField').val("this is a value");
    });

    var app = angular.module('app', [ 'ngMessages' ]);

    app.controller('MyCtrl', function MainCtrl() {
    });
</script>

生成的输入字段的html代码显示以下类：

<input id="myField" name="myField" ng-model="myField" type="text" required="" class="ng-pristine ng-invalid ng-invalid-required ng-touched">

我会为此创建一个planker或fiddler，但我无法将Angular Messages模块挂钩。

Answer 1

这对我有用：

$scope.$apply(function(){
  $scope.myForm.myField.$setValidity("required", true);
});

Angular 1.3.14

通过JQuery设置输入字段值会使AngularJS上的所需验证失败

1 个答案: