diff --git a/src/components-examples/material/tree/tree-dynamic/tree-dynamic-example.html b/src/components-examples/material/tree/tree-dynamic/tree-dynamic-example.html
index ec295ca82728..fdce4887c32a 100644
--- a/src/components-examples/material/tree/tree-dynamic/tree-dynamic-example.html
+++ b/src/components-examples/material/tree/tree-dynamic/tree-dynamic-example.html
@@ -12,7 +12,7 @@
{{node.item}}
- @if (node.isLoading) {
+ @if (node.isLoading()) {
diff --git a/src/components-examples/material/tree/tree-dynamic/tree-dynamic-example.ts b/src/components-examples/material/tree/tree-dynamic/tree-dynamic-example.ts
index cc359acf5ea7..f45535688959 100644
--- a/src/components-examples/material/tree/tree-dynamic/tree-dynamic-example.ts
+++ b/src/components-examples/material/tree/tree-dynamic/tree-dynamic-example.ts
@@ -1,6 +1,6 @@
import {CollectionViewer, SelectionChange, DataSource} from '@angular/cdk/collections';
import {FlatTreeControl} from '@angular/cdk/tree';
-import {ChangeDetectionStrategy, Component, Injectable, inject} from '@angular/core';
+import {ChangeDetectionStrategy, Component, Injectable, inject, signal} from '@angular/core';
import {BehaviorSubject, merge, Observable} from 'rxjs';
import {map} from 'rxjs/operators';
import {MatProgressBarModule} from '@angular/material/progress-bar';
@@ -14,7 +14,7 @@ export class DynamicFlatNode {
public item: string,
public level = 1,
public expandable = false,
- public isLoading = false,
+ public isLoading = signal(false),
) {}
}
@@ -108,7 +108,7 @@ export class DynamicDataSource implements DataSource {
return;
}
- node.isLoading = true;
+ node.isLoading.set(true);
setTimeout(() => {
if (expand) {
@@ -128,7 +128,7 @@ export class DynamicDataSource implements DataSource {
// notify the change
this.dataChange.next(this.data);
- node.isLoading = false;
+ node.isLoading.set(false);
}, 1000);
}
}