如何在模板中输入自定义元素指令设置ng-dirty / ng-pristine？

Question

我在AngularJS中使用自定义指令构建了一个表单元素。

表单中的自定义元素：

<form class="login-form" name="loginForm">
    <elm-input-text class="has_bottomSpace" name="email" ng-model="email" required></elm-input-text>
</form>

指令：

app.directive("elmInputText", function(){
        return {
            restrict: 'E',
            replace: true,
            scope: {
                ngModel: '=ngModel',
                name: '@'
            },
            templateUrl: 'src/templates/input-text-template.html'
        };
    });

模板：

<div class="inputText">
    <input class="inputText-input" ng-model="ngModel" name="{{name}}">
    <label>Label</label>
</div>

我希望div在各方面都像普通的表单元素一样，所以我最感兴趣的是附加到该元素的类名，而不是附加到模板内部的类名。

我已经将这个用于ng-valid / ng-invalid类，并且ng-model反映了输入中的值。我现在面临的问题是ng-pristine / ng-dirty仅应用于输入而不应用于div。我该如何解决这个问题？