akveo / akveo/nebular

NbSelect doesn't display the [selected] option if data is dynamic

未关闭
#2,145 21 条评论 19 个 reaction 已指派 0 人 在 GitHub 查看
主要语言
TypeScript
星标
8.1k
派生
1.5k
PR 合并指标
30 天内没有已合并 PR

描述

### Issue type

**I'm submitting a ...** (check one with "x")

* [x] bug report
* [ ] feature request

### Issue description

**Current behavior:**
I have a NbSelect populated with options from the database. Neither using [selected] or ([ngModel]) makes it display the selected value. As soon as I pass static data it works as intended.

**Expected behavior:**
It should automatically select the selected option.

**Steps to reproduce:**
Put NbSelect on page, have a simple MySQL database to support the exchange of data, take the data and put them as options.

**Related code:**
Unfortunately since it requires my localhost mySQL here, I can't provide a stackblitz, but I can include some snippets.

header.component.html
```

{{ lang.short }}

```

header.component.ts
```
service.exp.subscribe((exp: any) => {
this.languages = exp.langs.map(x => {
return {
short: x.short,
name: x.name
}
});

this.selectedLang.next(this.languages.filter(x => x.short === translate.currentLang)[0]);
});
```

header.service.ts
```
this.server.getLangsList().subscribe((langs: any) => {
this.exp.next({
langs: langs
});
});
```

server.service.ts
```
getLangsList() {
return this.request('GET', `http://localhost:8080/langs`);
//return of([{"idLang":1,"short":"en","name":"English","dateFormat":"YYYY-MM-DD","dateTimeFormat":"YYYY-MM-DD HH:mm:ss"}]);
}
```
Now, in the last snippet, the two rows return the same Observable. In the caso of the second (static data) it displays the [selected] value correctly, in the first it doesn't.

I'm not sure it's related to the issue 2088, so I started a new issue
#2088

### Other information:

**npm, node, OS, Browser**
```
Node version 10.16.0
npm version 6.10.3
Windows 10, on Chrome
```

**Angular, Nebular**
```
ngx-admin v4.0.1, nebular v4.1.2
```

贡献指南

打开贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。