md-textarea

I would like to add md-textarea. From what I’ve tried(c&p md-input code, changing selector and template), it should be pretty straightforward, as it just worked without any changes to style or the component itself.

The differences between input and textarea are

• textarea doesn’t have type, step, list attributes
• textarea might have auto expand/size(probably not needed in the first iteration)

Since 90% of the component is made of annotations, and those cannot be inherited, the way to go(I think) might be either to extend selector

selector: 'md-input,md-textarea',

and use ElementRef to check which selector matched(unless there’s a better way I don’t know of) and *ngIfthe template to either <input> or <textarea>.

or keep only one selector(that is md-input), and add md-textarea as attribute, and *ngIf the template depending on that.

In both cases I’d be needed add check that type was not added along <md-textarea> or md-textarea, because of _convertValueForInputType, there won’t be no need to do anything with step or list, since those simply won’t be on the *ngIf’d template.

Thoughts?

---

as for autosize, there’s this tiny thing https://github.com/stevepapa/angular2-autosize

import { ElementRef, HostListener, Directive} from 'angular2/core';

@Directive({
    selector: 'textarea[autosize]'
})

export class Autosize {
 @HostListener('input',['$event.target'])
  onInput(textArea) {
    this.adjust();
  }
  constructor(public element: ElementRef){
  }
  ngOnInit(){
    this.adjust();
  }
  adjust(){
    this.element.nativeElement.style.overflow = 'hidden';
    this.element.nativeElement.style.height = 'auto';
    this.element.nativeElement.style.height = this.element.nativeElement.scrollHeight + "px";
  }
}

which utilizes scrollHeight, which is apparently supported by most browsers https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollHeight

[fxck]

It’s in master, but not released on npm.

[alvaro450]

@jelbourn @kara, when do you guys think text area will make it to material components?