Angular $valid value doesn't updates when the input is not valid - angularjs

Question

I'm trying to make a directive of input elements, with the following template
<label class="item-custom item-input input">
<i class="iconic"></i> <!-- gets icon class -->
<input /> <!-- gets all necessary attributes -->
</label>
The problem is that $valid Boolean gets the 'true' at the beginning and doesn't update after.
Here is my directive:
main.directive('dtnInput', function () {
return {
controller: function ($scope, dictionary) {
$scope.d = dictionary;
},
restrict: 'EAC',
compile: function(element, attr) {
var input = element.find('input');
var icon = element.find('i');
angular.forEach({
'type': attr.type,
'placeholder': attr.placeholder,
'ng-value': attr.ngValue,
'ng-model': attr.ngModel,
'ng-disabled': attr.ngDisabled,
'icon': attr.ngIcon,
'ng-maxlength': attr.ngMaxlength,
'name': attr.name
}, function (value, name) {
if (angular.isDefined(value)) {
if (name == 'icon') {
icon.attr('class', value);
} else {
input.attr(name, value);
}
}
});
},
templateUrl: 'templates/directives/dtn-input.html'
};
});
and the HTML
<form name="myForm">
<dtn-input type="number"
placeholder="number"
name="phone"
ng-icon="icon-login"
ng-model="user.phone"
ng-maxlength="5">
</dtn-input>
<input type="text"
name="firstName"
ng-model="user.firstName"
ng-maxlength="5"
required />
<span>
value: {{user.phone}}
</span><br />
<span>
error: {{myForm.phone.$valid}}
</span>
</form>
Thanks for help!
==== UPDATE =======
I found the bug.
The problem occurred because i called to directive attributes with the names of angular directives:
<dtn-input type="number"
placeholder="number"
name="phone"
ng-icon="icon-login"
ng-model="user.phone" - //this
ng-maxlength="5"> - //and this