import { CommonModule } from '@angular/common'; import { AfterViewInit, ChangeDetectionStrategy, Component, OnInit, forwardRef, input, model, } from '@angular/core'; import { MatButtonModule } from '@angular/material/button'; import { MatIconModule } from '@angular/material/icon'; import { ListMessage } from '../model/proto-message.model'; import { ProtoFieldComponent } from '../proto-field/proto-field.component'; @Component({ selector: 'app-list-field', standalone: true, imports: [ CommonModule, MatButtonModule, MatIconModule, forwardRef(() => ProtoFieldComponent), ], template: `

{{ label() }}

@if(values()) { @for(value of values(); track $index) {
} } `, styleUrl: './list-field.component.scss', changeDetection: ChangeDetectionStrategy.OnPush, }) export class ListFieldComponent { label = input(); configuration = input.required(); values = model(); add() { const newValues = this.values(); if (newValues) { newValues.push(null); this.values.set(newValues); } else { this.values.set([null]); } } remove(index: number) { const newValues = this.values(); newValues?.splice(index, 1); this.values.set(newValues); } }