Как перетащить angular панель объяснения без изменений внешних данных? - PullRequest
0 голосов
/ 02 мая 2020

У меня есть список задач, использующий материал angular, и у меня проблема с панелью объяснения с помощью перетаскивания. Когда я перетаскиваю поле «Готово к работе», данные внутри панели объяснения изменяются в соответствии с другими данными Div.

См. Изображение ниже для лучшего понимания

enter image description here

enter image description here

Вот код

<div class="example-container">
    <h2>To do</h2>
    <div cdkDropList #todoList="cdkDropList" [cdkDropListData]="todo" [cdkDropListConnectedTo]="[doneList]"
        class="example-list" (cdkDropListDropped)="drop($event)">
        <mat-accordion *ngFor="let item of todo" cdkDrag>
            <mat-expansion-panel>
                <mat-expansion-panel-header>
                    <mat-panel-title>
                        {{item}}
                    </mat-panel-title>
                    <mat-panel-description>
                    </mat-panel-description>
                </mat-expansion-panel-header>

                <mat-form-field>
                    <mat-label>First name</mat-label>
                    <input matInput>
                </mat-form-field>

                <mat-form-field>
                    <mat-label>Age</mat-label>
                    <input matInput type="number" min="1">
                </mat-form-field>
            </mat-expansion-panel>
        </mat-accordion>
    </div>
</div>
<div class="example-container">
    <h2>Done</h2>
    <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="done" [cdkDropListConnectedTo]="[todoList]"
        class="example-list" (cdkDropListDropped)="drop($event)">
        <mat-accordion *ngFor="let item of done" cdkDrag>
            <mat-expansion-panel>
                <mat-expansion-panel-header>
                    <mat-panel-title>
                        {{item}}
                    </mat-panel-title>
                    <mat-panel-description>
                    </mat-panel-description>
                </mat-expansion-panel-header>

                <mat-form-field>
                    <mat-label>First name</mat-label>
                    <input matInput>
                </mat-form-field>
            </mat-expansion-panel>
        </mat-accordion>
    </div>
</div>

Пожалуйста, помогите мне решить эту проблему. Любое решение приветствуется ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...