Question

我见过this，但它在我的代码中不起作用。我在使用Dragula的{{1}}应用程序中使用Angular2。

我需要获取draged元素的元素的id。这是typescript类的一部分：

Typescript

我知道constructor(private dragulaService: DragulaService) { dragulaService.drop.subscribe((value) => { this.onDrop(value.slice(1)); }); } private onDrop(args) { let [e, el] = args; console.log("on Drop"); console.log(e); console.log(el); }包含draged元素，但是如何从typescript中的html元素中获取id？

Answer 1

如果el是拖动的元素，则其ID为el.id。这就是DOM的工作原理。如果您要拖动元素<div id="foo">something</div>并在代码中将此元素分配给el，则el.id将为"foo"。

Answer 2

如果您的html元素是从对象模型派生的，那么现在有一种更简洁的方法可以通过dragula v2.0获取ID。

通过使用[(dragulaModel)]，您可以访问整个对象模型，包括对象的ID。例如：

在html中：

<div [(dragulaModel)]="listOfItems">
   <div *ngFor="let item of listOfItems">
   </div>
</div>

然后，在您的Angular服务中：

this.subs.add(
   dragulaService.dropModel().subscribe((value) => {
      // prints the item's id
      console.log(value.item.id);
   })
)

此方法最好的部分是，您可以使用value.item来访问所拖动项目的所有属性。查看文档：{{3}}

Dragula：获取被拖动项目的类和ID

2 个答案: