mirror of
https://github.com/angular/angular.git
synced 2026-09-14 13:54:52 +08:00
fix(drag-drop): enterPredicate being called with wrong drop container (#13578)
Fixes the `enterPredicate` being called with the item's current container, rather than the one it is being moved into. Also tweaks the function signature to avoid unnecessary null checks and expands the description.
This commit is contained in:
committed by
Andrew Seguin
parent
6afe3f557f
commit
60b4a58bc3
@@ -1437,6 +1437,28 @@ describe('CdkDrag', () => {
|
||||
});
|
||||
}));
|
||||
|
||||
it('should call the `enterPredicate` with the item and the container it is entering',
|
||||
fakeAsync(() => {
|
||||
const fixture = createComponent(ConnectedDropZones);
|
||||
fixture.detectChanges();
|
||||
|
||||
const dropInstances = fixture.componentInstance.dropInstances.toArray();
|
||||
const spy = jasmine.createSpy('enterPredicate spy').and.returnValue(true);
|
||||
const groups = fixture.componentInstance.groupedDragItems.slice();
|
||||
const dragItem = groups[0][1];
|
||||
const targetRect = groups[1][2].element.nativeElement.getBoundingClientRect();
|
||||
|
||||
dropInstances[1].enterPredicate = spy;
|
||||
fixture.detectChanges();
|
||||
|
||||
dragElementViaMouse(fixture, dragItem.element.nativeElement,
|
||||
targetRect.left + 1, targetRect.top + 1);
|
||||
flush();
|
||||
fixture.detectChanges();
|
||||
|
||||
expect(spy).toHaveBeenCalledWith(dragItem, dropInstances[1]);
|
||||
}));
|
||||
|
||||
it('should be able to start dragging after an item has been transferred', fakeAsync(() => {
|
||||
const fixture = createComponent(ConnectedDropZones);
|
||||
fixture.detectChanges();
|
||||
|
||||
@@ -77,11 +77,12 @@ export class CdkDrop<T = any> implements OnInit, OnDestroy {
|
||||
@Input('cdkDropLockAxis') lockAxis: 'x' | 'y';
|
||||
|
||||
/**
|
||||
* Function that is used to determine whether an item
|
||||
* is allowed to be moved into a drop container.
|
||||
* Function that is used to determine whether an item is allowed to be moved
|
||||
* into a drop container. The function will be called with the item that is
|
||||
* being dragged and the container that it's being moved into.
|
||||
*/
|
||||
@Input('cdkDropEnterPredicate')
|
||||
enterPredicate: (drag?: CdkDrag, drop?: CdkDrop) => boolean = () => true
|
||||
enterPredicate: (drag: CdkDrag, drop: CdkDrop) => boolean = () => true
|
||||
|
||||
/** Emits when the user drops an item inside the container. */
|
||||
@Output('cdkDropDropped')
|
||||
@@ -315,7 +316,7 @@ export class CdkDrop<T = any> implements OnInit, OnDestroy {
|
||||
const result = this._positionCache.siblings
|
||||
.find(sibling => isInsideClientRect(sibling.clientRect, x, y));
|
||||
|
||||
return result && result.drop.enterPredicate(item, this) ? result.drop : null;
|
||||
return result && result.drop.enterPredicate(item, result.drop) ? result.drop : null;
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
Reference in New Issue
Block a user