Skip to content

Commit af2b626

Browse files
authored
docs: convert CDK overlay to signals (#33591)
1 parent 7f8a729 commit af2b626

2 files changed

Lines changed: 6 additions & 6 deletions

File tree

‎src/components-examples/cdk/overlay/cdk-overlay-basic/cdk-overlay-basic-example.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
<!-- This button is the origin to which the overlay is attached -->
2-
<button (click)="isOpen = !isOpen" type="button" cdkOverlayOrigin #origin="cdkOverlayOrigin">
3-
{{isOpen ? "Close" : "Open"}}
2+
<button (click)="isOpen.update(isOpen => !isOpen)" type="button" cdkOverlayOrigin #origin="cdkOverlayOrigin">
3+
{{isOpen() ? "Close" : "Open"}}
44
</button>
55

66
<!-- This template displays the overlay content and is connected to the button -->
77
<ng-template
88
cdkConnectedOverlay
99
[cdkConnectedOverlayOrigin]="origin"
10-
[cdkConnectedOverlayOpen]="isOpen"
11-
(detach)="isOpen = false"
10+
[cdkConnectedOverlayOpen]="isOpen()"
11+
(detach)="isOpen.set(false)"
1212
>
1313
<ul class="example-list">
1414
<li>Item 1</li>

‎src/components-examples/cdk/overlay/cdk-overlay-basic/cdk-overlay-basic-example.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {Component} from '@angular/core';
1+
import {Component, signal} from '@angular/core';
22
import {OverlayModule} from '@angular/cdk/overlay';
33

44
/**
@@ -11,5 +11,5 @@ import {OverlayModule} from '@angular/cdk/overlay';
1111
imports: [OverlayModule],
1212
})
1313
export class CdkOverlayBasicExample {
14-
isOpen = false;
14+
isOpen = signal(false);
1515
}

0 commit comments

Comments
 (0)