chore: update demo with max selection warning

ng-select · Sep 5, 2018 · b4ea12d · b4ea12d
1 parent 32d1825
commit b4ea12d
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 5 deletions.
diff --git a/demo/app/examples/multi.component.ts b/demo/app/examples/multi.component.ts
@@ -43,7 +43,11 @@ import { DataService } from '../shared/data.service';
 
         <label>Select multiple elements with a limit number of selections (e.g 3)</label>
         ---html,true
+        <div class="alert alert-warning mb-2" *ngIf="selectedPeople2.length === 3 && select.focused">
+            <small >Max selection reached</small>
+        </div>
         <ng-select
+                #select
                 [items]="people$2 | async"
                 [multiple]="true"
                 [maxSelectedItems]="3"

diff --git a/src/ng-select/ng-select.component.ts b/src/ng-select/ng-select.component.ts
@@ -154,10 +154,10 @@ export class NgSelectComponent implements OnDestroy, OnChanges, AfterViewInit, C
     dropdownId = newId();
     selectedItemId = 0;
     element: HTMLElement;
+    focused: boolean;
 
     private _defaultLabel = 'label';
     private _primitive: boolean;
-    private _focused: boolean;
     private _manualOpen: boolean;
     private _pressedKeys: string[] = [];
     private _compareWith: CompareWithFn;
@@ -278,7 +278,7 @@ export class NgSelectComponent implements OnDestroy, OnChanges, AfterViewInit, C
             return;
         }
 
-        if (!this._focused) {
+        if (!this.focused) {
             this.focus();
         }
 
@@ -474,13 +474,13 @@ export class NgSelectComponent implements OnDestroy, OnChanges, AfterViewInit, C
     }
 
     onInputFocus($event) {
-        if (this._focused) {
+        if (this.focused) {
             return;
         }
 
         this.element.classList.add('ng-select-focused');
         this.focusEvent.emit($event);
-        this._focused = true;
+        this.focused = true;
     }
 
     onInputBlur($event) {
@@ -489,7 +489,7 @@ export class NgSelectComponent implements OnDestroy, OnChanges, AfterViewInit, C
         if (!this.isOpen && !this.disabled) {
             this._onTouched();
         }
-        this._focused = false;
+        this.focused = false;
     }
 
     onItemHover(item: NgOption) {