2016-07-05 54 views
1

如何在div中包装某些字段并且不使用fieldGroup.I要所有div都有'left-layout'类将由类'left-container'包装
控制器:以角度形式包裹div中的某些字段

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> 

这是jsbin链接:http://jsbin.com/honuxi/edit?html,js,output

回答

0

为什么你不希望使用FIELDGROUP?这就是你如何做到的。您将className添加到fieldGroup,然后用您在formly配置中预定义的包装包装fieldGroup:

.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' 
     } 
     } 
    }] 
];