Skip to content

Commit c0841f1

Browse files
authored
docs(material/form-field): disable bubbling on prefix in example (#29069)
* form field button click event bubbling fix * mousevent change
1 parent 8f54edf commit c0841f1

File tree

2 files changed

+5
-1
lines changed

2 files changed

+5
-1
lines changed

src/components-examples/material/form-field/form-field-prefix-suffix/form-field-prefix-suffix-example.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<mat-form-field>
33
<mat-label>Enter your password</mat-label>
44
<input matInput [type]="hide ? 'password' : 'text'">
5-
<button mat-icon-button matSuffix (click)="hide = !hide" [attr.aria-label]="'Hide password'" [attr.aria-pressed]="hide">
5+
<button mat-icon-button matSuffix (click)="clickEvent($event)" [attr.aria-label]="'Hide password'" [attr.aria-pressed]="hide">
66
<mat-icon>{{hide ? 'visibility_off' : 'visibility'}}</mat-icon>
77
</button>
88
</mat-form-field>

src/components-examples/material/form-field/form-field-prefix-suffix/form-field-prefix-suffix-example.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,4 +14,8 @@ import {MatFormFieldModule} from '@angular/material/form-field';
1414
})
1515
export class FormFieldPrefixSuffixExample {
1616
hide = true;
17+
clickEvent(event: MouseEvent) {
18+
this.hide = !this.hide;
19+
event.stopPropagation();
20+
}
1721
}

0 commit comments

Comments
 (0)