Issues with label wrapper styles.

[juanpujol]

I've a custom field using ui.bootstrap datepicker. The option.type is "datepicker" so it doesn't work with this line here:

module.exports = "<label for=\"{{id}}\" ng-style=\"['input', 'textarea', 'select'].indexOf(options.type) === -1 && {'font-size':'12px', 'color': 'rgb(117, 117, 117)'}\">\n {{to.label}}\n</label>\n<formly-transclude></formly-transclude>\n";

I had to manually add my field to the array on ng-style so the label will work as expected.

module.exports = "<label for=\"{{id}}\" ng-style=\"['input', 'textarea', 'select', 'datepicker'].indexOf(options.type) === -1 && {'font-size':'12px', 'color': 'rgb(117, 117, 117)'}\">\n {{to.label}}\n</label>\n<formly-transclude></formly-transclude>\n";

Is there any other way to deal with this? I understand it's nessesary because of checkboxes or radios. But it ends up limiting my avility to extend and create more fields.

Thank you.

[kamilkisiela]

The easiest way of doing this and much more simpler would be creating two separate wrappers.

So original types like input, textarea, select and datepicker will have let's call it labelSrc
and other fields label.

So label will have ng-style (in that case just style attribute) but labelSrc won't.

What do you think? Is it simply enough and won't be misleading?

[juanpujol]

I think that could solve the problem. But also it will be confusing having 2 diferent label wrappers.

Are you thinking on doing this for this for this library or is a recommendation for this specific case?

Thanks.

[kamilkisiela]

It is much more simpler with templates like lumx and bootstrap. Label wrapper is independent from whichever type you use. It has own class and style, correct in any case.

In material templates it is much more complicated because mdInputContainer contains label.

I think it could be done with css class with proper selectors but I'm trying to avoid css files in that package.

I'm going to think about it and to try few things.

Maybe you have an idea to do it nicely?

About your question. It is good when wrapper can be used with all types. That's the reason of that ng-style thing :)