angular - Collapsing items in dx-forms

Question

We are currently using dx-forms and dxi-items in our page to add sections. I am trying to make these sections collapsable but looks like collapsable cannot be done with dx-forms and we should be using dx-accordion. There no examplse how we can use the dx-accordion with dx-forms

<div id="create-new-container">
    <p class="title">New</p>
    <dx-form class="create-form"
        [(formData)]="newData"
        [showRequiredMark]="false"
        labelLocation="left"
        >
        <dxi-item #info [colCount]="2" itemType="group" caption="Description"  >
            <dxi-item itemType="group">
                <dxi-item>
                    <div class="dx-field">
                        <div class="dx-field-label">Name</div>
                        <div class="dx-field-value">
                            <dx-text-box value="Test name" [showClearButton]="true" [disabled]=true></dx-text-box>
                        </div>
                    </div>
                </dxi-item>

Can anyone please help with using according instead of the forms in devextreeme

标签： angulardevextreme

Answer 1

您可以将 DX 表单作为手风琴的一部分添加到 DX 项目中。

<dx-accordion #accordion [collapsible]="true" [multiple]="false" [animationDuration]="300">
    <dxi-item title="Collapse title">
        <dx-form>
            <!-- Form data -->
        </dx-form>
    </dxi-item>
</dx-accordion>