动态添加ng模式，缺少验证类

Dynamically adding ng-pattern, missing validation classes

本文关键字：验证 添加 ng 模式 动态      更新时间：2023-09-26

我正在尝试从指令中动态添加和删除"ng模式"属性。这是我的指示：

ap.directive('myDirective', ['$compile', function ($compile) {
    return {
        scope: { test: "=myDirective" },
        link: function ($scope, element, attrs) {
            $scope.$watch('test', function () {
                if (someCondition) {
                    element.removeAttr("ng-pattern");
                } else {
                    element.attr("ng-pattern", "/^([0-9]{5})$|^([0-9]{9})$/");
                }
            });
        }
    };
}]);

以及来自html:的输入标签

<form name="myform" novalidate>
    <input name="test" required class="form-control" ng-model="myModel" my-    directive="someValueFromScope"/>
</form>

如果我从Chrome开发工具中检查DOM元素，"ng模式"属性会添加到输入标记中，但不会添加验证类（ng无效模式或ng有效模式）。如果我直接从html中添加"ng模式"，那么一切都会按预期进行。

使用$compile和$set进行如下操作：-

attrs.$set("ng-pattern", "/^([0-9]{5})$|^([0-9]{9})$/");
$compile(element)($scope);

使用$observe方法而不是$watch

attrs.$observe('test', function () {
      //do something
});

我终于明白了，编译父作用域就成功了。

$compile(element)($scope.$parent)
相关文章：