From e7e48964fcb91d9b085f72aba64b714c27e7251b Mon Sep 17 00:00:00 2001
From: Jonathan Ziller <jonathan.ziller@gmail.com>
Date: Sun, 15 Apr 2018 17:36:34 +0200
Subject: [PATCH] feat(example app): add directive to fix material list options
 deselecting themselves when navigating away from the page

---
 .../src/app/material/mat-list-option-fix.ts        | 14 ++++++++++++++
 example-app/src/app/material/material.module.ts    |  3 +++
 2 files changed, 17 insertions(+)
 create mode 100644 example-app/src/app/material/mat-list-option-fix.ts

diff --git a/example-app/src/app/material/mat-list-option-fix.ts b/example-app/src/app/material/mat-list-option-fix.ts
new file mode 100644
index 00000000..b1c1df21
--- /dev/null
+++ b/example-app/src/app/material/mat-list-option-fix.ts
@@ -0,0 +1,14 @@
+
+import { Directive, Host, OnDestroy } from '@angular/core';
+import { MatListOption } from '@angular/material/list';
+
+@Directive({
+  selector: 'mat-list-option',
+})
+export class MatListOptionFixDirective implements OnDestroy {
+  constructor(@Host() private matDirective: MatListOption) { }
+
+  ngOnDestroy() {
+    this.matDirective.selectionList = { _reportValueChange: () => void 0 } as any;
+  }
+}
diff --git a/example-app/src/app/material/material.module.ts b/example-app/src/app/material/material.module.ts
index a7eb5bcb..0e6723be 100644
--- a/example-app/src/app/material/material.module.ts
+++ b/example-app/src/app/material/material.module.ts
@@ -17,6 +17,7 @@ import {
 
 import { CustomErrorStateMatcherDirective } from './error-state-matcher';
 import { NgrxMatSelectValueAccessor } from './mat-select-value-accessor';
+import { MatListOptionFixDirective } from './mat-list-option-fix';
 
 @NgModule({
   imports: [
@@ -36,6 +37,7 @@ import { NgrxMatSelectValueAccessor } from './mat-select-value-accessor';
   declarations: [
     NgrxMatSelectValueAccessor,
     CustomErrorStateMatcherDirective,
+    MatListOptionFixDirective,
   ],
   exports: [
     MatInputModule,
@@ -52,6 +54,7 @@ import { NgrxMatSelectValueAccessor } from './mat-select-value-accessor';
     MatNativeDateModule,
     NgrxMatSelectValueAccessor,
     CustomErrorStateMatcherDirective,
+    MatListOptionFixDirective,
   ],
   providers: [
     { provide: MAT_PLACEHOLDER_GLOBAL_OPTIONS, useValue: { float: 'always' } }