In order to do a little work around on AngularJS Material inputs, I would like to know if I can parameter all ngMessages directives without create a new one or add my attribute everywhere.
<md-input-container class="md-block" flex>
<label>Label</label>
<input type="number" name="number" ng-model="number" min="0" max="10" required>
<div ng-messages="form.number.$error" md-auto-hide="false"> <!-- mdAutoHide -->
<div ng-message="required">This is required</div>
<div ng-message="min">Min is 0</div>
<div ng-message="max">Max is 10</div>
</div>
</md-input-container>
Is there a solution to automatically add mdAutoHide attribute on all ngMessages?
You could write a directive specially for this. This short code is wrong, cause it's a long time I didn't do angular js. But yon can see the approach:
//directive
angular.module('app').directive('messageHidden', function () {
var tpl = '<div>ng-messages="form.number.$error" md-auto-hide="false"></div>'
for(var input in $scope.inputs){
tpl += '<div ng-message="'+input.type+'">'"+input.message+"'</div>';
}
return {
restrict: 'E',
replace: true,
transclude: true,
scope: {name: '@inputs'},
template: tpl
}
});
//ctrl
$scope.inputs = [
{
"type" : "required",
"message" : "this is required"
},
{
"type" : "min",
"message" : "min is 0"
},
{
"type" : "max",
"message" : "max is 10"
},
]
//view
<messageHidden inputs="$scope.inputs"/>