angular - Angular - cdkDrag 不适用于 span 标签

Question

我正在使用 Angular Material 的拖放模块。How evercdkDrag似乎不适span用于我观察到的其他几个标签，例如a标签。

组件.html

<div class='user' *ngFor='let user of usersTask; let i = index'>
  User:  {{i}}
  <span class='task' *ngFor='let task of user' cdkDropList cdkDrag>
    {{task}}
  </span>
</div>

组件.ts

import { Component } from '@angular/core';

@Component({
  selector: 'some-root',
  templateUrl: './some.component.html',
  styleUrls: ['./some.component.scss']
})
export class SomeComponent {
  usersTask = [[
    'Get to work',
    'Pick up groceries',
    'Go home',
    'Fall asleep'
  ],[
    'Get up',
    'Brush teeth',
    'Take a shower',
    'Check e-mail',
    'Walk dog'
  ]];
}

但是，如果我span用div标签替换它就可以了。

任何想法，为什么会发生这种情况？以及如何解决这个问题？

提前致谢！

Answer 1

看到cdkDropList在“div”中，而不是在“span”中

<div class='user' *ngFor='let user of usersTask; let i = index' cdkDropList >
  User:  {{i}}
  <span class='task' *ngFor='let task of user' cdkDrag>
    {{task}}
  </span>
</div>