Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 1 addition & 3 deletions src/cdk-experimental/popover-edit/popover-edit-module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,7 @@ import {
CdkPopoverEditTabOut,
CdkRowHoverContent,
CdkEditable,
CdkEditOpen,
CdkEditOpenButton
CdkEditOpen
} from './table-directives';
import {CdkEditControl,
CdkEditRevert,
Expand All @@ -34,7 +33,6 @@ const EXPORTED_DECLARATIONS = [
CdkEditClose,
CdkEditable,
CdkEditOpen,
CdkEditOpenButton,
];

@NgModule({
Expand Down
33 changes: 12 additions & 21 deletions src/cdk-experimental/popover-edit/table-directives.ts
Original file line number Diff line number Diff line change
Expand Up @@ -391,33 +391,24 @@ export class CdkRowHoverContent implements AfterViewInit, OnDestroy {
* element or an ancestor element.
*/
@Directive({
// Specify :not(button) as we only need to add type: button on actual buttons.
selector: '[cdkEditOpen]:not(button)',
host: {
'(click)': 'openEdit($event)',
}
selector: '[cdkEditOpen]',
host: {'(click)': 'openEdit($event)'}
})
export class CdkEditOpen {
constructor(
protected readonly elementRef: ElementRef,
protected readonly editEventDispatcher: EditEventDispatcher) {}
protected readonly elementRef: ElementRef<HTMLElement>,
protected readonly editEventDispatcher: EditEventDispatcher) {

const nativeElement = elementRef.nativeElement;

// Prevent accidental form submits.
if (nativeElement.nodeName === 'BUTTON' && !nativeElement.getAttribute('type')) {
nativeElement.setAttribute('type', 'button');
}
}

openEdit(evt: Event): void {
this.editEventDispatcher.editing.next(closest(this.elementRef.nativeElement!, CELL_SELECTOR));
evt.stopPropagation();
}
}

/**
* Opens the closest edit popover to this element, whether it's associated with this exact
* element or an ancestor element.
*/
@Directive({
// Specify button as we only need to add type: button on actual buttons.
selector: 'button[cdkEditOpen]',
host: {
'(click)': 'openEdit($event)',
'type': 'button', // Prevents accidental form submits.
}
})
export class CdkEditOpenButton extends CdkEditOpen {}
6 changes: 2 additions & 4 deletions src/material-experimental/popover-edit/popover-edit-module.ts
Original file line number Diff line number Diff line change
Expand Up @@ -13,8 +13,7 @@ import {
MatPopoverEdit,
MatPopoverEditTabOut,
MatRowHoverContent,
MatEditOpen,
MatEditOpenButton
MatEditOpen
} from './table-directives';
import {
MatEditLens,
Expand All @@ -29,8 +28,7 @@ const EXPORTED_DECLARATIONS = [
MatEditLens,
MatEditRevert,
MatEditClose,
MatEditOpen,
MatEditOpenButton,
MatEditOpen
];

@NgModule({
Expand Down
24 changes: 3 additions & 21 deletions src/material-experimental/popover-edit/table-directives.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,7 @@ import {
CdkPopoverEdit,
CdkPopoverEditTabOut,
CdkRowHoverContent,
CdkEditOpen,
CdkEditOpenButton,
CdkEditOpen
} from '@angular/cdk-experimental/popover-edit';

const POPOVER_EDIT_HOST_BINDINGS = {
Expand Down Expand Up @@ -107,25 +106,8 @@ export class MatRowHoverContent extends CdkRowHoverContent {
* element or an ancestor element.
*/
@Directive({
// Specify :not(button) as we only need to add type: button on actual buttons.
selector: '[matEditOpen]:not(button)',
host: {
'(click)': 'openEdit($event)',
}
selector: '[matEditOpen]',
host: {'(click)': 'openEdit($event)'}
})
export class MatEditOpen extends CdkEditOpen {
}

/**
* Opens the closest edit popover to this element, whether it's associated with this exact
* element or an ancestor element.
*/
@Directive({
// Specify button as we only need to add type: button on actual buttons.
selector: 'button[matEditOpen]',
host: {
'(click)': 'openEdit($event)',
'type': 'button', // Prevents accidental form submits.
}
})
export class MatEditOpenButton extends CdkEditOpenButton {}