Two Way Data Binding - Angular 2

Question

Im trying to make two way data binding with ngModel and it not working. FormsModule is included. here the code:

app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { TestComponent } from './test/test.component';

@NgModule({
  declarations: [
    TestComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

test.component.ts:

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

@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {

  person = {
    name: 'David',
    age: '17'
  };

  constructor() { }

  ngOnInit() {
  }

}

test.component.html:

<form>
  <input type="text" [(ngModel)]="person.name" />
  <input type="text" [(ngModel)]="person.age" />
</form>

{{person.name}}<br />
{{person.age}}

Why it's not working?

Thanks.

Answer 1

Other way is to add

[ngModelOptions]="{standalone: true}" 

he understands he is no part of the form.

Answer 2

You must add name attribute to inputs.