From be19a2a96114efbdb4dc72cedd4989ce86523ca8 Mon Sep 17 00:00:00 2001
From: "L. Henze" <lh435@nyu.edu>
Date: Tue, 8 Oct 2019 12:38:01 -0400
Subject: [PATCH] from @art-lowel: set ngModel for select, and also selected
 attribute for options

That currentOptionId$ observable is then used in the template to set the ngModel for the select, which, as mentioned above, should have been enough to select the correct option, but as it wasn't I also use it to set the selected attribute on the options
---
 .../comcol-page-browse-by.component.html              | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/app/shared/comcol-page-browse-by/comcol-page-browse-by.component.html b/src/app/shared/comcol-page-browse-by/comcol-page-browse-by.component.html
index ee8ff8ff79..91dc8a4b1f 100644
--- a/src/app/shared/comcol-page-browse-by/comcol-page-browse-by.component.html
+++ b/src/app/shared/comcol-page-browse-by/comcol-page-browse-by.component.html
@@ -10,9 +10,14 @@
   </div>
   <div class="d-block d-sm-none">
 
-    <select name="browse-type" class="form-control" aria-label="Browse Community or Collection" (change)="onSelectChange(($event.target))">
-
-      <option *ngFor="let option of allOptions" >{{ option.label | translate }}</option>
+    <select name="browse-type"
+            class="form-control"
+            aria-label="Browse Community or Collection"
+            (ngModelChange)="onSelectChange($event)"
+            [ngModel]="currentOptionId$ | async">
+      <option *ngFor="let option of allOptions"
+            [ngValue]="option.id"
+            [attr.selected]="(currentOptionId$ | async) === option.id ? 'selected' : null">{{ option.label | translate }}</option>
     </select>
   </div>
 </nav>