Angular forms returning ERROR TypeError: "_co.service.formData is undefined"?

View other answers to this thread
Start a personal dev blog on your domain for free and grow your readership.

3.4K+ developers have started their personal blogs on Hashnode in the last one month.

Write in Markdown · Publish articles on custom domain · Gain readership on day zero · Automatic GitHub backup and more

Biplab Malakar's photo
<form (sumbit)="signUp(form)" autocomplete="off" #form="ngForm"> 
    <div class="form-group"> 
       <input name="Name" class="form-control" [(ngModel)]="service.formData.Name" required> 
  </div> 
</form>
import { Component, OnInit } from '@angular/core'; 
import {UserService} from '../../shared/user.service'; 
import {NgForm} from '@angular/forms'; 
@Component({ 
    selector: 'app-agent-signup', 
    templateUrl: './agent-signup.component.html', 
    styleUrls: ['./agent-signup.component.css'] 
}) 
export class AgentSignupComponent implements OnInit {
   constructor(public service:UserService) { }
   ngOnInit() { } 
   signUp(form:NgForm) { }
}

User service

import { Injectable } from '@angular/core';
import {UserData} from './user.model'; 
import {HttpClient} from '@angular/common/http'; 
import {environment} from '../../environments/environment'; 
const API_URL=environment.apiUrl; 
@Injectable({ providedIn: 'root' }) 
export class UserService { 
  formData : UserData = new  UserData();// you needto be  init with default value other wise formData doesn't have anything.
  constructor(private http:HttpClient) {}
  createUser(formData:UserData) { 
     return this.http.post(API_URL+'/user/signup',formData); 
   }
}

model

export class UserData{
   public Email:string = '';  // field with default value
   public Password:string = ''; 
   public Rera_no:string =''; 
   public Name:string = ''; 
   public Company_name:string = ''; 
}