Angular 形式:如何将 class 添加到包装 div
Angular Formly: how to add class to wrapping div
<formly-form model="vm.model" fields="step.inputs" options="vm.options">
<div style="text-align:right">
<button type="submit" wz-next class="btn btn-primary submit-button" ng-disabled="innerForm.$invalid">Næste</button>
</div>
</formly-form>
使用上面的标记会生成更多 og 更少的标准形式,但我的问题是基于我字段的 templateOptions
中设置的值,我希望能够添加 class 到表单字段 div.
例如:
inputs: [
{
key: 'someKey',
type: 'input',
templateOptions: {
label: 'some text',
class: 'floatLeft'
}
},
{
key: 'someKey',
type: 'input',
templateOptions: {
label: 'some text',
class: 'floatRight'
}
}]
应该生成 2 个这样的表单字段:
<div formly-field ng-repeat="field in fields " class="floatLeft ..." ...>...</div>
<div formly-field ng-repeat="field in fields " class="floatRight ..." ...>...</div>
所以 class 被添加到 div,我试过使用包装器,但它们不环绕 formly-field div。
由于 step.inputs
是一个字段数组,我不确定该怎么做。
要将 类 添加到 formly-field
div
,您只需在字段配置的根目录上指定一个 className
。所以:
inputs: [
{
key: 'someKey',
type: 'input',
className: 'floatRight',
templateOptions: {
label: 'some text'
}
},
{
key: 'someKey',
type: 'input',
className: 'floatRight',
templateOptions: {
label: 'some text'
}
}
]
<formly-form model="vm.model" fields="step.inputs" options="vm.options">
<div style="text-align:right">
<button type="submit" wz-next class="btn btn-primary submit-button" ng-disabled="innerForm.$invalid">Næste</button>
</div>
</formly-form>
使用上面的标记会生成更多 og 更少的标准形式,但我的问题是基于我字段的 templateOptions
中设置的值,我希望能够添加 class 到表单字段 div.
例如:
inputs: [
{
key: 'someKey',
type: 'input',
templateOptions: {
label: 'some text',
class: 'floatLeft'
}
},
{
key: 'someKey',
type: 'input',
templateOptions: {
label: 'some text',
class: 'floatRight'
}
}]
应该生成 2 个这样的表单字段:
<div formly-field ng-repeat="field in fields " class="floatLeft ..." ...>...</div>
<div formly-field ng-repeat="field in fields " class="floatRight ..." ...>...</div>
所以 class 被添加到 div,我试过使用包装器,但它们不环绕 formly-field div。
由于 step.inputs
是一个字段数组,我不确定该怎么做。
要将 类 添加到 formly-field
div
,您只需在字段配置的根目录上指定一个 className
。所以:
inputs: [
{
key: 'someKey',
type: 'input',
className: 'floatRight',
templateOptions: {
label: 'some text'
}
},
{
key: 'someKey',
type: 'input',
className: 'floatRight',
templateOptions: {
label: 'some text'
}
}
]