Adding attributes to Angular formly “formly-field” div

Question

The generated angular formly fields are all wrapped in one of these Divs: <div formly-field ng-repeat="field in fields ">...</div>

I would like to know how do I add extra attributes to this div? I'm using flexbox for responsiveness and would like the Div to be rendered as: <div formly-field ng-repeat="field in fields" flex-gt-sm="50" flex-sm="100" flex-xs="100">...</div>

Answer 1

You probably would need to overwrite formlyForm template using something like that

`

.config(['$provide', Decorate]);
   function Decorate($provide) {

       $provide.decorator('formlyFormDirective', function($delegate) {

           var directive = $delegate[0];
           var templateFn = directive.template;
           directive.template = function (el, attrs) {
           var out = templateFn (el, attrs);
           // out is a string so just insert your new attributes wherever you need them
           return out;
       }

       return $delegate;
   });   
}

`