How can I set ng-dirty / ng-pristine to a custom element directive with input inside a template?

I created a form element using a custom directive in AngularJS.

Custom element in the form:

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

      

        
        
        
      

    

Directive

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

      

        
        
        
      

    

Template:

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

      

        
        
        
      

    

I want the div to behave like a normal form element in every way, so I'm most interested in the class names that are attached to that element, not the class names that are attached to the inner template.

This already works for me for the ng-valid / ng-invalid class, and also ng-model reflects the value inside the input. The problem I am facing now is that ng-pristine / ng-dirty is only applied on the input, not the div. How can I fix this?