带有 select 列表的 ngModel
ngModel with select list
我在从 select 元素输出值时遇到问题。
<select
([ngModel])="office_hour_start"
name="office_hour_start">
<option
*ngFor="let time of times"
value="{{time.i}}">
{{ time.i }}
</option>
</select>
这个设置在这里对我有用:
<select
[(ngModel)]="employee_id"
name="employee_id"
class="form-control">
<option
*ngFor="let employee of employees"
value="{{employee.id}}">
{{ employee.name }}
</option>
</select>
<select ng-options="time as time.i for time in office_hour_start track by time.id" ng-model="selected">
<option value="{{time.i}}">{{time.i}}</option>
</select>
希望这有帮助,使用 ng-options 而不是 ng-for
关于适合您的设置,另外一个建议是:
// When using an ngModel, an event emitter () should be inside the input [] always
// Though there is an instance where you can use it separately [ngModel] for Input (ngModelChange) for event emitter
<select [(ngModel)]="employee_id"
name="employee_id"
class="form-control">
<option *ngFor="let employee of employees"
value="{{employee.id}}"> // use [value]="employee.id" if you're assigning a dynamic value
{{ employee.name }}
</option>
</select>
And for the case of the office_hour_start is its ngModel. You used
([ngModel])="office_hour_start" instead of [(ngModel)]="office_hour_start" putting the parenthesis inside the brackets [] is the way to fix it.
已创建Stackblitz Demo供您参考
我在从 select 元素输出值时遇到问题。
<select
([ngModel])="office_hour_start"
name="office_hour_start">
<option
*ngFor="let time of times"
value="{{time.i}}">
{{ time.i }}
</option>
</select>
这个设置在这里对我有用:
<select
[(ngModel)]="employee_id"
name="employee_id"
class="form-control">
<option
*ngFor="let employee of employees"
value="{{employee.id}}">
{{ employee.name }}
</option>
</select>
<select ng-options="time as time.i for time in office_hour_start track by time.id" ng-model="selected">
<option value="{{time.i}}">{{time.i}}</option>
</select>
希望这有帮助,使用 ng-options 而不是 ng-for
关于适合您的设置,另外一个建议是:
// When using an ngModel, an event emitter () should be inside the input [] always
// Though there is an instance where you can use it separately [ngModel] for Input (ngModelChange) for event emitter
<select [(ngModel)]="employee_id"
name="employee_id"
class="form-control">
<option *ngFor="let employee of employees"
value="{{employee.id}}"> // use [value]="employee.id" if you're assigning a dynamic value
{{ employee.name }}
</option>
</select>
And for the case of the office_hour_start is its ngModel. You used ([ngModel])="office_hour_start" instead of [(ngModel)]="office_hour_start" putting the parenthesis inside the brackets [] is the way to fix it.
已创建Stackblitz Demo供您参考