[英]preselect foreigen content in dynamic populated dropdown in HTML/Bootstrap/angular2
I'm facing the issue to preselect an entry in a dynamic populated dropdown. 我面临在动态填充的下拉列表中预选择一个条目的问题。
It's about a filed for choosing a language. 这是关于选择一种语言的文件。 The possible languages are populated dynamically.
可能的语言是动态填充的。 I want to have a preselected value as a hint, which is not included in this list.
我希望有一个预选的值作为提示,该值未包含在此列表中。 Eg "Choose language"
例如“选择语言”
Here is my code what I thougt it might work: 这是我可能会起作用的代码:
<select id="languageSelection" class="form-control" [(ngModel)]="selectedLanguage" (ngModelChange)="onLanguageChange($event)">
<option selected disabled hidden>Choose language</option>
<option class="" *ngFor="let l of languages" [ngValue]="l">{{l}}</option>
</select>
I get the list of the languages, but there is a language preselected. 我得到了语言列表,但是预先选择了一种语言。 If I remove the "hidden"-tag the "Choose language" appears grayed out in the list.
如果删除“隐藏”标签,则“选择语言”在列表中显示为灰色。 But a language is preselected, too.
但是语言也是预先选择的。
Thank you in advance! 先感谢您!
[(ngModel)]
is overriding the selected attribute. [(ngModel)]
覆盖所选属性。 A workaround would be to set a predefined value to your variable selectedLanguage
, and use that in the options as default value, so for example: 一种解决方法是为您的变量
selectedLanguage
设置预定义值,然后在选项中将其用作默认值,例如:
TS: TS:
selectedLanguage = 0;
HTML: HTML:
<select id="languageSelection" class="form-control" [(ngModel)]="selectedLanguage" (ngModelChange)="onLanguageChange($event)">
<option [disabled]="true" value="0">Choose Language</option>
<option class="" *ngFor="let l of languages" [ngValue]="l">{{l}}</option>
</select>
That should do it :) 那应该做的:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.