我很确定我在这里做错了什么。我有一个具有dragula模型的简单组件,并且在拖动到它时我不想接受重复项。
为了检查重复项,我想在包的accept函数内使用dragula ngModel绑定数组,该数组是组件属性(personInfoList),但由于它不是参数,因此始终为空。我知道我应该使用目标,但这是一个html元素,并通过它进行查询并搜索是否已存在拖动的元素,效果不是很好。
这是打字稿文件:
export class PersonGroupComponent implements OnInit {
@Input() templateData: string;
personInfoList: Array<PersonInfo> = [];
listGroup: Group;
constructor(private dragulaService: DragulaService) {
}
ngOnInit() {
this.listGroup = this.dragulaService.find(`personInfoList`);
this.listGroup.options.removeOnSpill = true;
this.listGroup.options.copy = (el, source) => { return source.id === 'sidebar' };
this.listGroup.options.copyItem = (person: PersonInfo) => { return new Person() };
this.listGroup.options.accepts = (el, target, source, sibling) => {
console.log(el);
const draggedElementId: number = parseFloat(el.querySelector('user-mgmt-person').id);
console.log(draggedElementId);
if (target.id !== 'sidebar' && !this.isInList(this.personInfoList, parseInt(el.id))) {
return true;
}
};
}
personModelChanged(event: Array<PersonInfo>) {
console.log('person list updated from drag event');
console.log(event);
}
isInList(list: PersonInfo[], id: number): boolean {
list.forEach(element => {
if (element.personId === id) {
return true;
}
});
return false;
}
为使问题更笼统,除了使用accept函数中的参数外,还有其他方法可以在接受拖动元素时搜索重复项吗?