Состояние ng-формы в директиве не распространяется на внешнюю форму

Question

У меня есть директива myNumber, которая содержит несколько вложенных ng-форм вокруг ввода. Вход имеет атрибут ng-required, установленный в true, и определенный шаблон ng. Дело в том, что состояние ввода (например, ng-valid-required, ng-invalid-pattern) распространяется на ng-формы внутри директивы. Таким образом, они получают то же состояние, что и сам ввод, что является требуемым поведением. Но, выйдя за пределы самой директивы, ng-форма вокруг директивы не получает состояния ng-форм внутри.

<ng-form name="outerForm" id="outerForm">
    <my-number ...></my-number>
</ng-form>

В то время как входная директива и внутренняя директива ng-формы имеют состояние, подобное ng-valid-required ng-dirty ng-invalid ng-invalid-pattern, externalForm является ng-нетронутым ng-valid.

Это нормальное поведение, это то, как работает AngularJS, или есть обходной путь для получения состояния вне директивы?

Answer 1

Я решил проблему с помощью функции контроллера следующим образом:

      controller: function($scope) {
            $scope.$watch('innerForm.$valid', function() {
                if ($scope.innerForm.$valid) {
                    $scope.$parent.outerForm.$setValidity(null, true);
                } else {
                    $scope.$parent.outerForm.$setValidity(null, false);
                }
            });
        }