login typo, loop in feedback

my-workspace/projects/sae-lib/inputs/multi-selector/multi-selector.html

@@ -4,7 +4,7 @@
 }"
      class="input-box"
 >
-
+  displayDropdown {{displayDropdown}}
 
   <i class="ri-search-line search-placeholder"></i>
   <div class="label">
@@ -27,7 +27,7 @@
     <i class="ri-arrow-down-s-line"></i>
   </div>
 
-  @if (displayDropdown && availableChoices?.length) {
+  @if (displayDropdown ) {
 
 
     <div class="dropdown">
@@ -35,26 +35,33 @@
         <!--      selected:-->
         @if (selectedChoices?.length && availableChoices?.length) {
           <div class="selected-items">
+
+            @for(sc of selectedChoices; track sc.value){
             <div (click)="selectedChoicesChangeToggleItem(sc)"
-                 *ngFor="let sc of selectedChoices"
+
                  class="dropdown-item"
             >
               <i class="ri-checkbox-line"></i>
-              {{ sc }}
+              {{ sc.label }}
             </div>
+            }
           </div>
 
           <hr>
         }
         <div class="available-items">
+
           <!--      available:-->
-          <div (click)="availableChoicesChangeToggleItem(ac)"
-               *ngFor="let ac of availableChoices"
-               class="dropdown-item"
-          >
-            <i class="ri-checkbox-blank-line"></i>
-            {{ ac }}
-          </div>
+          @for(sc of availableChoices; track sc.value){
+            <div (click)="availableChoicesChangeToggleItem(sc)"
+
+                 class="dropdown-item"
+            >
+              <i class="ri-checkbox-line"></i>
+              {{ sc.label }}
+            </div>
+          }
+
         </div>
       </div>
     </div>