Question

我将ng2-dragula软件包用于拖放功能，但是一旦对列表项重新排序，就无法获取更新的数组列表值。这是我所做的代码。

HTML

      <ul [dragula]='"bag-items"' [dragulaModel]="contactArray">
                  <li *ngFor="let field of contactArray" >
                    <label>{{field.role}}</label>
                 </li>
      </ul>

JS

import { DragulaService   } from "ng2-dragula";

@Component({
  selector: 'app-edit-project',
  templateUrl: './edit-project.component.html',
  styleUrls: ['./edit-project.component.css'],
  providers: [    
      DragulaService
  ]
})

export class ProjectComponent implements OnInit {

constructor(private dragula:DragulaService) {
console.log(this.contactArray)
}

}

当我尝试对列表重新排序后尝试管理contactArray时。我仍然可以使用默认顺序。

Default order looks like this

A
B
C
D

Once I reorder looks like

D
C
A
B

然后尝试了console.log(this.contactArray)，但我仍然获得默认的订单值。期待新的重新排序值。

请问任何专家建议。

Answer 1

您将需要使用双向绑定，例如：[(dragulaModel)]="contactArray"。以下是ng2-dragula doc的官方评论：

注意：v2更改[dragulaModel]的行为。它不再突变您提供的数组，而是将其浅表克隆并为您提供结果。使用[[dragulaModel）] =“ ...”进行双向绑定，或使用DragulaService dropModel和removeModel事件保存生成的新模型。

ng2-dragula重新排序列表无法获取

1 个答案: