try to fix some for loop tracking issues

This commit is contained in:
Joel Wetzell
2026-03-21 12:40:06 -05:00
parent 7ffcda5018
commit f2c88fe750
6 changed files with 7 additions and 11 deletions
@@ -1,7 +1,7 @@
@if (paramFormControl && paramInfo?.schema) { @if (paramFormControl && paramInfo?.schema) {
@if (arrayValue) { @if (arrayValue) {
<div cdkDropList (cdkDropListDropped)="dropItem($event)" [cdkDropListData]="arrayValue"> <div cdkDropList (cdkDropListDropped)="dropItem($event)" [cdkDropListData]="arrayValue">
@for (item of arrayValue; track trackByIndex(i, item); let i = $index) { @for (item of arrayValue; track $index; let i = $index) {
<div cdkDrag class="flex my-2 mr-2 items-center"> <div cdkDrag class="flex my-2 mr-2 items-center">
<label for="item-{{ i }}" class="text-white mr-1 hover:cursor-move" cdkDragHandle <label for="item-{{ i }}" class="text-white mr-1 hover:cursor-move" cdkDragHandle
>{{ i }}:</label >{{ i }}:</label
@@ -101,10 +101,6 @@ export class ArrayFormComponent implements OnInit {
} }
} }
trackByIndex(index: number, obj: any): any {
return index;
}
// NOTE(jwetzel): this is only needed for object item types // NOTE(jwetzel): this is only needed for object item types
updateItem(index: number, value: any) { updateItem(index: number, value: any) {
if (this.arrayValue) { if (this.arrayValue) {
@@ -19,7 +19,7 @@
<div class="text-white">Modules</div> <div class="text-white">Modules</div>
</div> </div>
<div class="flex-grow overflow-x-hidden overflow-y-auto gap-1.5"> <div class="flex-grow overflow-x-hidden overflow-y-auto gap-1.5">
@for (module of modules(); track module; let i = $index) { @for (module of modules(); track module.id; let i = $index) {
<div class="m-2"> <div class="m-2">
<app-module <app-module
[path]="`modules/${i}`" [path]="`modules/${i}`"
@@ -50,7 +50,7 @@
<mat-icon>error</mat-icon> <mat-icon>error</mat-icon>
<span class="ml-1">Module Errors</span> <span class="ml-1">Module Errors</span>
</div> </div>
@for (error of moduleConfigErrors(); track error) { @for (error of moduleConfigErrors(); track $index) {
<div class="ml-4 mb-1 text-white"> <div class="ml-4 mb-1 text-white">
{{ error.error }} {{ error.error }}
</div> </div>
@@ -10,7 +10,7 @@
<div class="text-white">Routes</div> <div class="text-white">Routes</div>
</div> </div>
<div class="flex-grow overflow-x-hidden overflow-y-auto gap-1.5"> <div class="flex-grow overflow-x-hidden overflow-y-auto gap-1.5">
@for (route of routes(); track route; let i = $index) { @for (route of routes(); track $index; let i = $index) {
<div class="m-2"> <div class="m-2">
<app-route <app-route
[path]="`routes/${i}`" [path]="`routes/${i}`"
@@ -59,7 +59,7 @@
</div> </div>
@if (processors() !== undefined && processors()!.length > 0) { @if (processors() !== undefined && processors()!.length > 0) {
<div class="border-2 border-gray-500 m-2"> <div class="border-2 border-gray-500 m-2">
@for (processor of processors(); track processor; let i = $index) { @for (processor of processors(); track $index; let i = $index) {
<div cdkDrag> <div cdkDrag>
<app-processor <app-processor
[path]="path() + '/processors/' + i" [path]="path() + '/processors/' + i"
@@ -80,7 +80,7 @@
<mat-icon>error</mat-icon> <mat-icon>error</mat-icon>
<span class="ml-1">Route Errors</span> <span class="ml-1">Route Errors</span>
</div> </div>
@for (error of routeConfigErrors(); track error) { @for (error of routeConfigErrors(); track error.index) {
<div class="ml-4 mb-1 text-white"> <div class="ml-4 mb-1 text-white">
{{ error.error }} {{ error.error }}
</div> </div>