Wrap some field in div in angular-formly - angularjs

Question

How can I wrap some field in div and don't use fieldGroup.I want to all div have class 'left-layout' will wrapped by class 'left-container'
Controller:
vm.fields = [
{
key: 'first',
type: 'input',
className: 'left-layout',
model: vm.model.name,
templateOptions: {
label: 'First Name'
}
},
{
key: 'last',
type: 'input',
model: vm.model.name,
className: 'left-layout',
templateOptions: {
label: 'Last Name'
}
},
{
key: 'email',
type: 'input',
templateOptions: {
label: 'Email Address',
type: 'email'
}
}
];
index.html
<script>
$('.left-layout').wrapAll("<div class='left-container'></div>");
</script>
This is jsbin link: http://jsbin.com/honuxi/edit?html,js,output

Answer 1

Why wouldn't you want to use fieldGroup? That's how you do that. You add the className to the fieldGroup and then wrap the fieldGroup with a wrapper you have pre-defined in the formly config:
.config(function config(formlyConfigProvider) {
formlyConfigProvider.setWrapper({
name: 'left-container',
template: '<div class="left-container">
<formly-transclude></formly-transclude>
</div>'
});
}
vm.fields = [
{
wrapper: 'left-container',
className: 'left-layout',
fieldGroup: [
{
key: 'first',
type: 'input',
model: vm.model.name,
templateOptions: {
label: 'First Name'
}
},
{
key: 'last',
type: 'input',
model: vm.model.name,
templateOptions: {
label: 'Last Name'
}
},
{
key: 'email',
type: 'input',
templateOptions: {
label: 'Email Address',
type: 'email'
}
}
}]
];