Chorehancement: update to Angular v22, 'zoneless' / 'reactive' (#13114)

src-ui/src/app/components/manage/document-attributes/custom-fields/custom-fields.component.html

@@ -8,16 +8,16 @@
     </div>
   </li>
 
-  @if (loading) {
+  @if (loading()) {
     <li class="list-group-item">
       <div class="spinner-border spinner-border-sm me-2" role="status"></div>
       <ng-container i18n>Loading...</ng-container>
     </li>
   }
 
-  @for (field of fields; track field) {
+  @for (field of fields(); track field) {
     <li class="list-group-item">
-      <div class="row fade" [class.show]="show">
+      <div class="row fade" [class.show]="show()">
         <div class="col d-flex align-items-center"><button class="btn btn-link p-0 text-start" type="button" (click)="editField(field)" [disabled]="!permissionsService.currentUserCan(PermissionAction.Change, PermissionType.CustomField)">{{field.name}}</button></div>
         <div class="col d-flex align-items-center">{{getDataType(field)}}</div>
         <div class="col">
@@ -64,7 +64,7 @@
       </div>
     </li>
   }
-  @if (!loading && fields.length === 0) {
+  @if (!loading() && fields().length === 0) {
     <li class="list-group-item" i18n>No fields defined.</li>
   }
 </ul>