AngularJS自定义表单控件验证

我在验证AngularJS中的自定义表单控件时遇到问题

这两个问题是：

我想在内容可编辑字段中未修改占位符/初始文本时触发自定义错误。我尝试过各种方法——但运气不佳（包括尝试编辑

$isValid

）

已解决：当

ng minlength

、

ng maxlength

和

ng required

无效时，我似乎无法触发错误消息上的

ng show

，使它们出现。（回答：我在div上没有attr的名字）

请参见下面的Plnkr和代码示例：

---

您可以使用

$pristine

检查输入值是否已更改

// load init value from DOM
ctrl.$setViewValue(elm.html());
ctrl.$setPristine();

---

表单上任何地方都没有名为

standfirst

的输入。此外，此指令应该做什么？不太清楚。@Ryanyuu该指令只是angular文档中自定义表单组件示例的样板。在您的评论之后，我已经修改了我的问题。我会在提交按钮的

ng disabled

上使用

$pristine

检查吗？防止无效提交。您可以使用

$valid

防止无效提交。但为了防止未更改的提交，您可以使用

$pristine

。我总是在

ng disable

属性中进行检查，但您也可以在submit函数中进行检查。

(function(angular) {
    'use strict';
    angular.module('form-example2', []).directive('contenteditable', function() {
        return {
            require: 'ngModel',
            link: function(scope, elm, attrs, ctrl) {
                // view -> model
                elm.on('blur', function() {
                    ctrl.$setViewValue(elm.html());
                });

                // model -> view
                ctrl.$render = function() {
                    elm.html(ctrl.$viewValue);
                };

                // load init value from DOM
                ctrl.$setViewValue(elm.html());
            }
        };
    });
})(window.angular);

<p ng-show="myForm.standfirst.$pristine" class="text-danger">Your start error message</p>

// load init value from DOM
ctrl.$setViewValue(elm.html());
ctrl.$setPristine();