Data binding ngModel not working in angular 12

Data binding ngModel not working in angular 12

app.component.ts

import { Component, VERSION } from '@angular/core';
@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {

   contact = {
    name:'',
    telephone:0 
  };
}

MagPro Premium Blogger Template Download for Free

app.component.html

<div class="row mt">
    <div class="col s12">
        <form>
            <div class="row">
                <div class="input-field col s6">
                    <i class="fa fa-user prefix"></i>
                    <label for="Name">Name</label>
                    <input type="text" name="name" [(ngModel)]="contact.name">
                </div>
                <div class="input-field col s6">
                    <i class="fa fa-phone prefix"></i>
                    <label for="telephone">telephone</label>
                    <input type="text" name="telephone" [(ngModel)]="contact.telephone">
                </div>
            </div>
        </form>
    </div>
    <button type="submit" class="btn-large red">submit</button>
    <p>{{ contact.telephone }}</p>
</div>

Top 7 Best Chrome Extensions for Blogging