Juicy Juicy - 9 months ago 146
TypeScript Question

Binding the value in a textarea

I'm trying to do the simplest two way binding in Angular2. I would like to share a variable between my component and it's template.

My template is:

<textarea [(ngModel)]="currentQuery"></textarea>

And my component is:

import { Component } from '@angular/core';
import { ViewChild } from '@angular/core';
import { OnInit } from '@angular/core';

moduleId: module.id,
selector: 'vs-home',
templateUrl: 'home.component.html'

export class HomeComponent {
private currentQuery: string = '';

According to the docs this should work but I'm getting:

Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'ngModel' since it isn't a known property of 'textarea'. ("
<div class="query-bar-container">
<textarea [ERROR ->][(ngModel)]="currentQuery"></textarea>
<!-- <button type="button" class="btn btn-default" (click"): HomeComponent@2:15

  imports: [BrowserModule /* or CommonModule, FormsModule]