Show the invalid color line (Material) & reactivate disabled (with Ma…

…terial style)

src/angular.ts

@@ -135,7 +135,7 @@ export class Select2 implements ControlValueAccessor {
 
     /** Whether the element is disabled. */
     @Input()
-    get disabled() { return false; /*this._ngControl ? this._ngControl.disabled : this._disabled;*/ }
+    get disabled() { return this._control ? this._control.disabled : this._disabled; }
     set disabled(value: any) { this._disabled = this._coerceBooleanProperty(value); }
 
     /** Whether the element is readonly. */
@@ -222,6 +222,7 @@ export class Select2 implements ControlValueAccessor {
     }
 
     toggleOpenAndClose() {
+        console.log('toggleOpenAndClose', this.disabled);
         if (this.disabled) {
             return;
         }
@@ -258,7 +259,9 @@ export class Select2 implements ControlValueAccessor {
     }
 
     focusin() {
-        this.focused = true;
+        if (!this.disabled) {
+            this.focused = true;
+        }
     }
 
     focusout(field: string) {

src/select2.less

@@ -476,5 +476,20 @@
     color: #ff5722;
   }
 
+  &.select2-container--disabled .select2-selection--single {
+    background-image: linear-gradient(to right,rgba(0,0,0,.26) 0,rgba(0,0,0,.26) 33%,transparent 0);
+    background-size: 4px 1px;
+    background-repeat: repeat-x;
+    background-color: transparent;
+    background-position: 0 bottom;
+    border: 0;
+  }
+}
 
+select2.ng-invalid.ng-touched .select2-container--default.material .select2-selection--single {
+  border-bottom-color: red;
+
+  &::before {
+    background-color: red;
+  }
 }