diff --git a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html
index 8cd2058699..2dbe164d01 100644
--- a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html
+++ b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html
@@ -7,7 +7,7 @@
   [nzData]="nodes"
   [nzTreeTemplate]="treeTemplate"
   [nzExpandedKeys]="expandedKeys"
-  [nzExpandedIcon]="expandedIconTemplate?.template || defaultIconTemplate"
+  [nzExpandedIcon]="expandedIconTemplate()?.template || defaultIconTemplate"
   (nzExpandChange)="onExpandedKeysChange($event)"
   (nzCheckboxChange)="onCheckboxChange($event)"
   (nzOnDrop)="onDrop($event)"
@@ -26,13 +26,13 @@
       <div class="d-inline-flex align-items-center abp-ellipsis-inline">
         <ng-container
           *ngTemplateOutlet="
-            customNodeTemplate ? customNodeTemplate?.template : defaultNodeTemplate;
+            customNodeTemplate() ? customNodeTemplate()?.template : defaultNodeTemplate;
             context: { $implicit: node }
           "
         />
       </div>
 
-      @if (menu) {
+      @if (menu()) {
         <div
           #dropdown="ngbDropdown"
           class="d-inline-block ms-1"
@@ -48,7 +48,7 @@
             aria-hidden="true"
           ></i>
           <div ngbDropdownMenu>
-            <ng-template *ngTemplateOutlet="menu; context: { $implicit: node }" />
+            <ng-template *ngTemplateOutlet="menu(); context: { $implicit: node }" />
           </div>
         </div>
       }
diff --git a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts
index 5c320a539b..97e0f305d6 100644
--- a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts
+++ b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts
@@ -2,7 +2,7 @@ import {
   ChangeDetectionStrategy,
   ChangeDetectorRef,
   Component,
-  ContentChild,
+  contentChild,
   EventEmitter,
   inject,
   Input,
@@ -60,9 +60,9 @@ export class TreeComponent implements OnInit {
 
   dropdowns = {} as { [key: string]: NgbDropdown };
 
-  @ContentChild('menu') menu: TemplateRef<any>;
-  @ContentChild(TreeNodeTemplateDirective) customNodeTemplate: TreeNodeTemplateDirective;
-  @ContentChild(ExpandedIconTemplateDirective) expandedIconTemplate: ExpandedIconTemplateDirective;
+  readonly menu = contentChild<TemplateRef<any>>('menu');
+  readonly customNodeTemplate = contentChild(TreeNodeTemplateDirective);
+  readonly expandedIconTemplate = contentChild(ExpandedIconTemplateDirective);
   @Output() readonly checkedKeysChange = new EventEmitter();
   @Output() readonly expandedKeysChange = new EventEmitter<string[]>();
   @Output() readonly selectedNodeChange = new EventEmitter();