How to enable a ng-select to be required so that a user have to select a option

Question

I have an ng-select statement and want to ensure that an option in the drop-down list is selected before continuing if a user did not select an option a message should appear to tell the user please select an option.

I have tried the answer in the following link: Angular ng select required option

Here is the ng-select I m working with:

   <ng-select [items]="mentorSessions"
                       [multiple]="false"
                       [closeOnSelect]="true"
                       [searchable]="true"
                       bindLabel="name"
                       [ngModelOptions]="{standalone: true}"
                       [(ngModel)]="mentorToShareTo">
   </ng-select>

Answer 1

You can use FormControl. First of all you need to add your ng-select inside a form, add to your form a formGroup and to the ng-select a formControlName. Finally on form submit send form's data to the TS file:

 <form [formGroup]="myform" (ngSubmit)="onSubmit(myform)">
   <ng-select formControlName="selector" [items]="mentorSessions"
                   [multiple]="false"
                   [closeOnSelect]="true"
                   [searchable]="true"
                   bindLabel="name"
                   [ngModelOptions]="{standalone: true}"
                   [(ngModel)]="mentorToShareTo">

In the TS file do the code below to create your form builder

myform: FormGroup;

constructor(
    private formBuilder: FormBuilder
) { }


ngOnInit() {
     this.myform = this.formBuilder.group({
          selector: ['', Validators.required]
     });                                                                   
}

What I wrote above normally covers your needs. If you want to take the input of ng-select to your TS file then create an onSubmit function as below:

onSubmit(data) {
  //do whatever you want with input data
}

For further information please reply to me. =)

Import in your app module:

import { ReactiveFormsModule, FormsModule } from '@angular/forms';

In your component.ts

import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { FormControl } from '@angular/forms';