动态添加 ng-pattern，缺少验证 类

Question

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

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-pattern" 属性会添加到输入标签，但验证 类 (ng-invalid -pattern 或 ng-valid-pattern) 未添加。如果我直接从 html 添加 "ng-pattern"，一切都会按预期进行。

Answer 1

为此使用 $compile 和 $set :-

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

Answer 2

使用 $observe 方法代替 $watch

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

Answer 3

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

$compile(element)($scope.$parent)