@@ -112,6 +112,7 @@ export class MdSuffix {}
112
112
'[disabled]' : 'disabled' ,
113
113
'[required]' : 'required' ,
114
114
'[attr.aria-describedby]' : 'ariaDescribedby || null' ,
115
+ '[attr.aria-invalid]' : '_isErrorState()' ,
115
116
'(blur)' : '_onBlur()' ,
116
117
'(focus)' : '_onFocus()' ,
117
118
'(input)' : '_onInput()' ,
@@ -210,7 +211,9 @@ export class MdInputDirective {
210
211
211
212
constructor ( private _elementRef : ElementRef ,
212
213
private _renderer : Renderer2 ,
213
- @Optional ( ) @Self ( ) public _ngControl : NgControl ) {
214
+ @Optional ( ) @Self ( ) public _ngControl : NgControl ,
215
+ @Optional ( ) private _parentForm : NgForm ,
216
+ @Optional ( ) private _parentFormGroup : FormGroupDirective ) {
214
217
215
218
// Force setter to be called in case id was not specified.
216
219
this . id = this . id ;
@@ -233,6 +236,17 @@ export class MdInputDirective {
233
236
// FormsModule or ReactiveFormsModule, because Angular forms also listens to input events.
234
237
}
235
238
239
+ /** Whether the input is in an error state. */
240
+ _isErrorState ( ) : boolean {
241
+ const control = this . _ngControl ;
242
+ const isInvalid = control && control . invalid ;
243
+ const isTouched = control && control . touched ;
244
+ const isSubmitted = ( this . _parentFormGroup && this . _parentFormGroup . submitted ) ||
245
+ ( this . _parentForm && this . _parentForm . submitted ) ;
246
+
247
+ return ! ! ( isInvalid && ( isTouched || isSubmitted ) ) ;
248
+ }
249
+
236
250
/** Make sure the input is a supported type. */
237
251
private _validateType ( ) {
238
252
if ( MD_INPUT_INVALID_TYPES . indexOf ( this . _type ) !== - 1 ) {
@@ -275,7 +289,7 @@ export class MdInputDirective {
275
289
// Remove align attribute to prevent it from interfering with layout.
276
290
'[attr.align]' : 'null' ,
277
291
'[class.mat-input-container]' : 'true' ,
278
- '[class.mat-input-invalid]' : '_isErrorState()' ,
292
+ '[class.mat-input-invalid]' : '_mdInputChild. _isErrorState()' ,
279
293
'[class.mat-focused]' : '_mdInputChild.focused' ,
280
294
'[class.ng-untouched]' : '_shouldForward("untouched")' ,
281
295
'[class.ng-touched]' : '_shouldForward("touched")' ,
@@ -354,9 +368,7 @@ export class MdInputContainer implements AfterViewInit, AfterContentInit, AfterC
354
368
355
369
constructor (
356
370
public _elementRef : ElementRef ,
357
- private _changeDetectorRef : ChangeDetectorRef ,
358
- @Optional ( ) private _parentForm : NgForm ,
359
- @Optional ( ) private _parentFormGroup : FormGroupDirective ) { }
371
+ private _changeDetectorRef : ChangeDetectorRef ) { }
360
372
361
373
ngAfterContentInit ( ) {
362
374
this . _validateInputChild ( ) ;
@@ -390,20 +402,10 @@ export class MdInputContainer implements AfterViewInit, AfterContentInit, AfterC
390
402
/** Focuses the underlying input. */
391
403
_focusInput ( ) { this . _mdInputChild . focus ( ) ; }
392
404
393
- /** Whether the input container is in an error state. */
394
- _isErrorState ( ) : boolean {
395
- const control = this . _mdInputChild . _ngControl ;
396
- const isInvalid = control && control . invalid ;
397
- const isTouched = control && control . touched ;
398
- const isSubmitted = ( this . _parentFormGroup && this . _parentFormGroup . submitted ) ||
399
- ( this . _parentForm && this . _parentForm . submitted ) ;
400
-
401
- return ! ! ( isInvalid && ( isTouched || isSubmitted ) ) ;
402
- }
403
-
404
405
/** Determines whether to display hints or errors. */
405
406
_getDisplayedMessages ( ) : 'error' | 'hint' {
406
- return ( this . _errorChildren . length > 0 && this . _isErrorState ( ) ) ? 'error' : 'hint' ;
407
+ let input = this . _mdInputChild ;
408
+ return ( this . _errorChildren . length > 0 && input . _isErrorState ( ) ) ? 'error' : 'hint' ;
407
409
}
408
410
409
411
/**
0 commit comments