CODEWITHSUNDEEP
angularangular4-forms
Rakesh Jogani
Rakesh Jogani

Reputation: 93

Dynamic bind drop down option in angular 4

I have use below code for bind repeated drop down and select drop down value which are store in database 

<div class="form-group row" *ngFor="let option of roles let x = index">
    <div class="col-8">
        <select [disabled]="adminstratorStatus=='true'" class="form-control custom-select col-12" id="company_info_management" required
        [(ngModel)]="option.module_defaultselection" name="company_info_management"
        #company_info_management="ngModel" (ngModelChange)="onSelect($event,x)">
            <option value=''>--select company--</option>
            <option *ngFor="let myRole of option.module_role;" value= {{myRole.module_role}}>
            <!--[ngValue]="myRole.module_role"-->
                {{myRole.module_role_description | translate }}
            </option>
        </select>
    </div>
</div>

Select drop down value using ngModel is not work

And module_defaultselection have proper value which are available in option in drop down.

Upvotes: 3

Views: 2149

Answers (1)

Rakesh Jogani
Rakesh Jogani

Reputation: 93

Use [ngModelOptions]="{standalone: true}" in select drop down refer below code 

<div class="form-group row" *ngFor="let option of roles let x = index">
      <div class="col-8">
          <select [disabled]="adminstratorStatus=='true'" class="form-control custom-select col-12" id="company_info_management" required
                                                    [(ngModel)]="roles[x].module_defaultselection" name="company_info_management"
                                                    #company_info_management="ngModel"   [ngModelOptions]="{standalone: true}">
                                                <option value="">--select company--</option>
                                                <option *ngFor="let myRole of option.module_role;" value="{{myRole.module_role}}"> {{myRole.module_role_description | translate }} </option>
                                            </select>
                                        </div>
                                    </div>

Upvotes: 3

Related Questions