fix: null-pointer exception if no form control directive on mat-select (

#282)

* fix: null-pointer exception if no form control directive on mat-select

fixes #281

* fixup! fix: null-pointer exception if no form control directive on mat-select

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 3.1.4
+* Fix: null-pointer exception if no form control directive on `mat-select`
+  [#281](https://github.com/bithost-gmbh/ngx-mat-select-search/issues/281)
+
+  Thanks to @Daishy for reporting
+
 ## 3.1.3
 * Fix: incorrect restoration of selection when using `[multiple]="true"`
   [#279](https://github.com/bithost-gmbh/ngx-mat-select-search/issues/279)

package.json

@@ -2,7 +2,7 @@
   "$schema": "./node_modules/ng-packagr/package.schema.json",
   "name": "ngx-mat-select-search",
   "description": "Angular component providing an input field for searching / filtering MatSelect options of the Angular Material library.",
-  "version": "3.1.3",
+  "version": "3.1.4",
   "license": "MIT",
   "scripts": {
     "ng": "ng",

src/app/mat-select-search/mat-select-search.component.ts

@@ -31,7 +31,7 @@ import { A, DOWN_ARROW, END, ENTER, ESCAPE, HOME, NINE, SPACE, UP_ARROW, Z, ZERO
 import { ViewportRuler } from '@angular/cdk/scrolling';
 import { LiveAnnouncer } from '@angular/cdk/a11y';
 import { BehaviorSubject, combineLatest, Observable, of, Subject } from 'rxjs';
-import { delay, filter, map, scan, startWith, switchMap, take, takeUntil, tap } from 'rxjs/operators';
+import { delay, filter, map, startWith, switchMap, take, takeUntil, tap } from 'rxjs/operators';
 
 import { MatSelectSearchClearDirective } from './mat-select-search-clear.directive';
 
@@ -553,6 +553,14 @@ export class MatSelectSearchComponent implements OnInit, OnDestroy, ControlValue
    * Note: to improve this code, mat-select should be extended to allow disabling resetting the selection while filtering.
    */
   private initMultipleHandling() {
+    if (!this.matSelect.ngControl) {
+      if (this.matSelect.multiple) {
+        // note: the access to matSelect.ngControl (instead of matSelect.value / matSelect.valueChanges)
+        // is necessary to properly work in multi-selection mode.
+        console.error('the mat-select containing ngx-mat-select-search must have a ngModel or formControl directive when multiple=true');
+      }
+      return;
+    }
     // if <mat-select [multiple]="true">
     // store previously selected values and restore them when they are deselected
     // because the option is not available while we are currently filtering

src/app/mat-select-search/ngx-mat-select-search.module.ts

@@ -17,7 +17,7 @@ import { CommonModule } from '@angular/common';
 import { MatSelectSearchClearDirective } from './mat-select-search-clear.directive';
 import { ReactiveFormsModule } from '@angular/forms';
 
-export const MatSelectSearchVersion = '3.1.2';
+export const MatSelectSearchVersion = '3.1.4';
 
 
 @NgModule({