Hi Guys ,
i am new in Angular world , i am trying to create a simple form with
validation. but as i add ngModel to textbox angular start adding property
name as text in textbox.
below is my Html
<form>
<div class="form-group">
<label for="CourseName">Course Name </label>
<input type="text" name="CourseName" [(ngModel)]='CourseName' #CourseName=
"ngModel" minlength="5" required class="form-control">
<div class="alert alert-danger" *ngIf="!CourseName.valid">
Course Name is required
</div>
</div>
<div class="form-group">
<label for="Category">Category</label>
<select class="form-control" Name="Category">
<option *ngFor="let category of CategoryTypes" [value]="category.Id">
{{category.Name}}</option>
</select>
</div>
<div class="checkbox">
<label>
<input type="checkbox"> 30 Days Guarantee
</label>
</div>
</form>
ts file content is as follows
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'course',
templateUrl: './course.component.html',
styleUrls: ['./course.component.css']
})
export class CourseComponent {
CourseName: string = 'Hero';
Category: number = 0;
HasGuarantee: boolean = false;
CategoryTypes: any[] = [{ Name: 'Development', Id: 1 }, { Name: 'Art', Id: 2
}, { Name: 'Language', Id: 3 }]
constructor() { }
}
below is output
<https://lh3.googleusercontent.com/-h6W0HKbUBZU/Wiw3AC7IXmI/AAAAAAAADpQ/l6yK6PUqT3omDTyCKNVI5xSPl_OHGudVACLcBGAs/s1600/Capture.PNG>
as you can see that "CourseName" is pre-filled on page load.
please help correcting my mistake.
Node Ver. 8.9.1
npm ver. 5.5.1
OS : Window 10 Pro
Angular 4 with bootstrap 3.3.7
thank you
Dheeraj KUmar
<https://lh3.googleusercontent.com/-h6W0HKbUBZU/Wiw3AC7IXmI/AAAAAAAADpQ/l6yK6PUqT3omDTyCKNVI5xSPl_OHGudVACLcBGAs/s1600/Capture.PNG>
--
You received this message because you are subscribed to the Google Groups
"Angular and AngularJS discussion" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
