Fixed 'No results to show' for both templates (#56)

* fix(tags-input): prevent dropdown from closing on tag selection

- Added a flag to decide the default behavior that closes the dropdown on tag selection.
- Related to a bug where users had to reopen the dropdown after each selection.

* fix(tags-input): fixed for attribute

* feat(dropdown): added a no record found message when searching for tags which are not available

* refactor(dropdown): refactored the dropdown with requested changes

* refactor(dropdown):  removed unused styles

* fix(dropdown): removed no results to show div from childTemplate

* refacto(dropdown): fixed the issue of no results to show for both custom and default template

* refactor(dropdown): fixed classes overlapping

---------

Co-authored-by: Zain Asif <[email protected]>

Author: ZainAsif767

projects/angular-tags-input/src/lib/dropdown/dropdown.component.html

@@ -1,6 +1,12 @@
 <ng-container
-  *ngTemplateOutlet="dropDownTemplate; context: context"
-></ng-container>
+ *ngTemplateOutlet="dropDownTemplate; context: context">
+</ng-container>
+
+<ng-container *ngIf="!context.items.length">
+    <div class="angular-tags-dropdown">
+      No results to show
+    </div>
+</ng-container>
 
 <!-- Default Tag Options Template -->
 <ng-template #defaultTagOptionTemplate let-items="items" let-config="config">
@@ -18,9 +24,6 @@
           {{ item[config.displayProperty] }}
         </div>
       </ng-container>
-      <ng-container *ngIf="!items.length">
-        <div>No results to show</div>
-      </ng-container>
     </div>
   </div>
 </ng-template>

projects/tags-input-demo/src/app/app.component.html

@@ -463,9 +463,6 @@ <h5 class="main__form__heading">4. Options with image</h5>
     </ng-container>
     </div>
   </div>
-  <div class="items-list__item" *ngIf="!items.length">
-    <span>No results to show</span>
-  </div>
 </ng-template>
 
 <ng-template #ddNestedChildrenTemplate let-items="items" let-fns="fns" let-config="config">