fix(select): handle null values in multi-select

src/lib/select/select.spec.ts

@@ -3823,6 +3823,28 @@ describe('MatSelect', () => {
       expect(fixture.componentInstance.select._keyManager.activeItemIndex).toBe(2);
     }));
 
+    it('should be to select an option with a `null` value', fakeAsync(() => {
+      fixture.componentInstance.foods = [
+        { value: null, viewValue: 'Steak' },
+        { value: 'pizza-1', viewValue: 'Pizza' },
+        { value: null, viewValue: 'Tacos' },
+      ];
+
+      fixture.detectChanges();
+      trigger.click();
+      fixture.detectChanges();
+
+      const options = overlayContainerElement.querySelectorAll('mat-option') as
+          NodeListOf<HTMLElement>;
+
+      options[0].click();
+      options[1].click();
+      options[2].click();
+      fixture.detectChanges();
+
+      expect(testInstance.control.value).toEqual([null, 'pizza-1', null]);
+    }));
+
   });
 });
 

src/lib/select/select.ts

@@ -870,18 +870,18 @@ export class MatSelect extends _MatSelectMixinBase implements AfterContentInit,
   private _onSelect(option: MatOption, isUserInput: boolean): void {
     const wasSelected = this._selectionModel.isSelected(option);
 
-    if (option.value == null) {
+    if (option.value == null && !this._multiple) {
       this._selectionModel.clear();
       this._propagateChanges(option.value);
     } else {
       option.selected ? this._selectionModel.select(option) : this._selectionModel.deselect(option);
 
-      // TODO(crisbeto): handle blank/null options inside multi-select.
       if (this.multiple) {
         this._sortValues();
 
         if (isUserInput) {
           this._keyManager.setActiveItem(option);
+
           // In case the user selected the option with their mouse, we
           // want to restore focus back to the trigger, in order to
           // prevent the select keyboard controls from clashing with