I am using ng-select in my application.
My component class is
export class ExampleComponent {
selectedCoursesList: Course[] = [];
courseList: any[] = [];
removeCourse( course: Course) {
this.selectedCoursesList.forEach((item, index) => {
if (item === course) {
this.selectedCoursesList.splice(index, 1);
}
});
}
}
and my html is
<ng-select placeholder="Choose course" [multiple]="true"
(ngModelChange)="updatecourse($event);"
[(ngModel)]="selectedCoursesList">
<ng-option *ngFor="let course of courseList" [value]="course" >
{{course.name}}
</ng-option>
</ng-select>
Here I want to achieve 2 things
Can any one tell me what I did wrong?
Thank You
I achieved this by adding [formControl]="courses" in my
<ng-select [formControl]="courses" placeholder="Choose course" [multiple]="true"
[(ngModel)]="selectedCoursesList">
<ng-option *ngFor="let course of courseList" [value]="course" >
{{course.name}}
</ng-option>
</ng-select>
and in my removeCourse method I added
this.courses.setValue(this.selectedWinaryList);
export class ExampleComponent {
selectedCoursesList: Course[] = [];
courseList: any[] = [];
courses= new FormControl();
removeCourse( course: Course) {
this.selectedCoursesList.forEach((item, index) => {
if (item === course) {
this.selectedCoursesList.splice(index, 1);
}
});
this.courses.setValue(this.selectedWinaryList);
}
}
when I remove course from the array it automatically un-selecting that course from the select list.