2016-07-05 63 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' 
     } 
     } 
    }] 
];