fix(dropdown): add missing multi-select placeholder (#505)

allianz · Jan 31, 2022 · c64da50 · c64da50
1 parent 0dff959
commit c64da50
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 1 deletion.
diff --git a/.../documentation/examples/dropdown/dropdown-multi-select/dropdown-multi-select-example.html b/.../documentation/examples/dropdown/dropdown-multi-select/dropdown-multi-select-example.html
@@ -20,6 +20,7 @@
         <div nxCol="12, 12, 6">
             <nx-formfield nxLabel="Fruits">
                 <nx-multi-select
+                    placeholder="Choose options"
                     [options]="complexOptions"
                     [selectLabel]="selectLabel"
                     [selectValue]="selectValue"

diff --git a/projects/ng-aquila/documentation/examples/dropdown/multi-select/multi-select-example.html b/projects/ng-aquila/documentation/examples/dropdown/multi-select/multi-select-example.html
@@ -2,6 +2,7 @@ <h3>With filter</h3>
 <nx-formfield appearance="outline" nxFloatLabel="always" nxLabel="Multi select">
     <nx-multi-select
         filter
+        placeholder="Choose options"
         [(ngModel)]="modelWithFilter"
         [options]="options"
         selectValue="id"
@@ -17,6 +18,7 @@ <h3>With filter</h3>
 <h3>Without filter</h3>
 <nx-formfield appearance="outline" nxFloatLabel="always" nxLabel="Multi select">
     <nx-multi-select
+        placeholder="Choose options"
         [(ngModel)]="model"
         [options]="options"
         [selectLabel]="selectLabel"

diff --git a/projects/ng-aquila/src/dropdown/multi-select/multi-select.component.html b/projects/ng-aquila/src/dropdown/multi-select/multi-select.component.html
@@ -18,7 +18,7 @@
     (focus)="_inputFocused = true"
     (keydown)="_onKeydown($event)"
 >
-    <span class="value-text">{{ _getValueText() }}</span>
+    <span class="value-text">{{ empty ? placeholder : _getValueText() }}</span>
     <span>{{ selectedItems.size ? '(' + selectedItems.size + ')' : '' }}</span>
     <nx-icon size="s" aria-hidden="true" class="indicator" name="chevron-down"></nx-icon>
 </div>