fix(select): optimize control flow for node insertion and update sample title

Author: Zneeky

projects/igniteui-angular/select/src/select/select.component.ts

@@ -624,21 +624,18 @@ export class IgxSelectComponent extends IgxDropDownComponent implements IgxSelec
             }
         }
 
-        for (let index = 0; index < orderedTopLevelNodes.length; index++) {
+        let nextReferenceNode: HTMLElement | null = null;
+        for (let index = orderedTopLevelNodes.length - 1; index >= 0; index--) {
             const node = orderedTopLevelNodes[index];
-            if (container.contains(node)) {
+            if (node.parentElement === container) {
+                nextReferenceNode = node;
                 continue;
             }
-            // Find the next node already in the container and insert before it
-            // to preserve template order.
-            let referenceNode: HTMLElement | null = null;
-            for (let nextIndex = index + 1; nextIndex < orderedTopLevelNodes.length; nextIndex++) {
-                if (orderedTopLevelNodes[nextIndex].parentElement === container) {
-                    referenceNode = orderedTopLevelNodes[nextIndex];
-                    break;
-                }
+            if (container.contains(node)) {
+                continue;
             }
-            container.insertBefore(node, referenceNode);
+            container.insertBefore(node, nextReferenceNode);
+            nextReferenceNode = node;
         }
     }
 

src/app/select/select.sample.html

@@ -103,7 +103,7 @@ <h1 class="select-sample__title">Select - disabled item</h1>
     </section>
 
     <section class="select-sample__section">
-        <h1 class="select-sample__title">TEST: &#64;if/&#64;else inside &#64;for</h1>
+        <h1 class="select-sample__title">Select - &#64;if/&#64;else inside &#64;for</h1>
         <igx-select #nestedTest [placeholder]="'Pick One'">
             <label igxLabel>Odd/Even Select</label>
             @for (item of testItems; track item; let e = $even) {