Browse Source

Refactor ContentChild usage to new contentChild function

Replaces the deprecated @ContentChild decorator with the new contentChild() function for menu, customNodeTemplate, and expandedIconTemplate. Updates template references to use function calls, improving compatibility with Angular's latest API.
pull/24765/head
Fahri Gedik 8 months ago
parent
commit
fd6c42d5c4
  1. 8
      npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html
  2. 8
      npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts

8
npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html

@ -7,7 +7,7 @@
[nzData]="nodes" [nzData]="nodes"
[nzTreeTemplate]="treeTemplate" [nzTreeTemplate]="treeTemplate"
[nzExpandedKeys]="expandedKeys" [nzExpandedKeys]="expandedKeys"
[nzExpandedIcon]="expandedIconTemplate?.template || defaultIconTemplate" [nzExpandedIcon]="expandedIconTemplate()?.template || defaultIconTemplate"
(nzExpandChange)="onExpandedKeysChange($event)" (nzExpandChange)="onExpandedKeysChange($event)"
(nzCheckboxChange)="onCheckboxChange($event)" (nzCheckboxChange)="onCheckboxChange($event)"
(nzOnDrop)="onDrop($event)" (nzOnDrop)="onDrop($event)"
@ -26,13 +26,13 @@
<div class="d-inline-flex align-items-center abp-ellipsis-inline"> <div class="d-inline-flex align-items-center abp-ellipsis-inline">
<ng-container <ng-container
*ngTemplateOutlet=" *ngTemplateOutlet="
customNodeTemplate ? customNodeTemplate?.template : defaultNodeTemplate; customNodeTemplate() ? customNodeTemplate()?.template : defaultNodeTemplate;
context: { $implicit: node } context: { $implicit: node }
" "
/> />
</div> </div>
@if (menu) { @if (menu()) {
<div <div
#dropdown="ngbDropdown" #dropdown="ngbDropdown"
class="d-inline-block ms-1" class="d-inline-block ms-1"
@ -48,7 +48,7 @@
aria-hidden="true" aria-hidden="true"
></i> ></i>
<div ngbDropdownMenu> <div ngbDropdownMenu>
<ng-template *ngTemplateOutlet="menu; context: { $implicit: node }" /> <ng-template *ngTemplateOutlet="menu(); context: { $implicit: node }" />
</div> </div>
</div> </div>
} }

8
npm/ng-packs/packages/components/tree/src/lib/components/tree.component.ts

@ -2,7 +2,7 @@ import {
ChangeDetectionStrategy, ChangeDetectionStrategy,
ChangeDetectorRef, ChangeDetectorRef,
Component, Component,
ContentChild, contentChild,
EventEmitter, EventEmitter,
inject, inject,
Input, Input,
@ -60,9 +60,9 @@ export class TreeComponent implements OnInit {
dropdowns = {} as { [key: string]: NgbDropdown }; dropdowns = {} as { [key: string]: NgbDropdown };
@ContentChild('menu') menu: TemplateRef<any>; readonly menu = contentChild<TemplateRef<any>>('menu');
@ContentChild(TreeNodeTemplateDirective) customNodeTemplate: TreeNodeTemplateDirective; readonly customNodeTemplate = contentChild(TreeNodeTemplateDirective);
@ContentChild(ExpandedIconTemplateDirective) expandedIconTemplate: ExpandedIconTemplateDirective; readonly expandedIconTemplate = contentChild(ExpandedIconTemplateDirective);
@Output() readonly checkedKeysChange = new EventEmitter(); @Output() readonly checkedKeysChange = new EventEmitter();
@Output() readonly expandedKeysChange = new EventEmitter<string[]>(); @Output() readonly expandedKeysChange = new EventEmitter<string[]>();
@Output() readonly selectedNodeChange = new EventEmitter(); @Output() readonly selectedNodeChange = new EventEmitter();

Loading…
Cancel
Save