Clever Geek Handbook

Angular4 select box on change returns wrong value

I want to do something for a new selection, but the onChange () event returns a colon-prefixed value. How do I get the correct value without prefix and colon?

education.component.html

<select class="form-control custom-select" name="course_id" id="course_id" formControlName="course_id" (change)="onChange($event.target.value)">
    <option value="">--Select--</option>
    <option *ngFor="let course of course_list" [ngValue]="course.id">{{ course.name }}({{course.id}})</option>
</select>

education.component.ts

onChange(value) : void {
   console.log('Course Value',value)
}

For example: I get the value 2: 8 . Expected Value 8

+5


source to share


1 answer


You just use [ngValue]

when you want to bind objects.

So, since it value.id

is a primitive value, use [value]

instead [ngValue]

:



<option *ngFor="let course of course_list" [value]="course.id">{{ course.name }}({{course.id}})</option>
+9


source






More articles:


All Articles