कोणीय 2 ngForm काम नहीं कर रहा

Question

मैं लॉगिन फॉर्म घटक करने की कोशिश कर रहा हूं लेकिन मैं फॉर्म डेटा नहीं पढ़ सकता।

जब मैं कंसोल पर उपयोगकर्ता नाम लिखने का प्रयास करता हूं, 'अपरिभाषित' लिखता है।

सबकुछ सामान्य लगता है लेकिन फॉर्म डेटा घटक में नहीं आता है।

<form (ngSubmit)="onSubmit(myForm)" 
     #myForm="ngForm" 
     class="form-signin"> 
    <div class="form-group"> 
     <h2 class="form-signin-heading">Please sign in</h2> 
     <input type="text" 
       id="inputUsername" 
       name="inputUsername" 
       class="form-control" 
       placeholder="User Name" 
       required> 
     <input type="password" 
       id="inputPassword" 
       name="inputPassword" 
       class="form-control" 
       placeholder="Password" > 
    </div> 
    <button class="btn btn-lg btn-primary btn-block" 
      type="submit">Sign in</button> 
</form> 

घटक ts:

@Component({ 
    selector: 'signin', 
    templateUrl: './signin.component.html', 
    encapsulation: ViewEncapsulation.None 
}) 
export class SigninComponent implements OnInit{ 
    constructor(){} 

    ngOnInit(){ } 

    onSubmit(form: NgForm){ 
     console.log(form.value.inputUsername); 
    } 
} 

अग्रिम धन्यवाद

नीचे दिए HTML कोड है।

Answer 1

आपको प्रत्येक फॉर्म फ़ील्ड में ngModel निर्देश जोड़ने की आवश्यकता है। यह फ़ॉर्म फ़ील्ड को आपके फॉर्म में पंजीकृत करता है।

<input type="text" 
      id="inputUsername" 
      name="inputUsername" 
      class="form-control" 
      placeholder="User Name" 
      ngModel 
      required>