Angular8下拉值在页面加载时没有绑定答案

【问题标题】：Angular8 dropdown value not binding on page loadAngular8下拉值在页面加载时没有绑定
【发布时间】：2020-09-02 13:25:19
【问题描述】：

我有一个位置下拉菜单，其选项来自 api 结果。如果之前已经保存了值，我有设置的模型。

            <select id="location" [(ngModel)]="location" name="location">
              <option value="">Select Location </option>                  
              <option *ngFor="let data of locationType" [ngValue]="data.locationId">{{data.locationValue}}</option>                  
           </select>

我在ngOnInit上设置位置模型，存储的值是用户登录时的位置存储

this.location=localStorage.locationId;

加载页面时，尽管模型具有 locationId，但模型会填充到下拉列表中，只有在多次单击页面后才会绑定

我无法理解这种行为，为什么会这样，任何输入都会有所帮助。

【问题讨论】：

您在开发者工具中看到任何错误吗？ (CTRL + SHIFT + I)，另外，您是否尝试使用 value 而不是 ngValue？（ngValue 通常用于对象而不是字符串）
@Erez.S ，感谢使用 value 成功了，也感谢您提供的信息，我不知道，
太棒了！很高兴为您提供帮助

标签： angular angular8

【解决方案1】：

正如我在 cmets 中所写，当使用字符串作为选项值时，您应该使用 value 而不是 ngValue

【讨论】：

【解决方案2】：

如果locationId 类型为Number，则在从localStorage 读取时需要转换它，因为它总是返回string。

this.location=localStorage.locationId ? parseInt(localStorage.locationId, 10) : null;

【讨论】：