https://akveo.github.io/nebular/docs/components/select/overview#nbselectcomponent
加载页面时是否可以有一个预先选择的值?
答案 0 :(得分:2)
存在issue with dynamic data,但是对于静态数据,它的工作方式如您提到的文档所述:
HTML:
<nb-select placeholder="Select Showcase" [(selected)]="selectedItem">
<nb-option value="">Option empty</nb-option>
<nb-option value="0">Option 0</nb-option>
<nb-option value="1">Option 1</nb-option>
<nb-option value="2">Option 2</nb-option>
<nb-option value="3">Option 3</nb-option>
<nb-option value="4">Option 4</nb-option>
</nb-select>
TS:selectedItem = '2';
答案 1 :(得分:1)
尝试一下:
<nb-select id="theme" [selected]="currentTheme" (selectedChange)="changeTheme($event)" status="primary">
<nb-select-label [innerHtml]="selectedTheme"></nb-select-label>
<nb-option langg *ngFor="let theme of themes" [value]="theme.value"> {{ theme.name | langg }}</nb-option>
</nb-select>
答案 2 :(得分:0)
[(selected)]=''
这就是我必须在<nb-select
>中添加的内容。
答案 3 :(得分:0)
在为 nbSelect 多表单控制器动态生成选项并显示已选择的项目时,我也遇到了同样的问题。我可以实现如下。
文件.html
<nb-select
fullWidth
placeholder="{{ title }}"
formControlName="value"
multiple
>
<nb-option
*ngFor="let option of options"
value="{{ option.key }}"
>
{{ option.value }}
</nb-option>
</nb-select>
文件.ts
let = selectedOptionKeys ["48c50001-dd7e-11eb-ad02-1d1ad36d5a53", "bc2edbd4-dfa4-11eb-a78c-5d1ee44adbd1", "636348eb-e992-11eb-9bb8-71a14542f9ee"]
this.formBuilder.group({
value: new FormControl(selectedOptionKeys),
});