Parameter default ngMessages directive

Question

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?

Answer 1

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"/>