Arrays 如何仅获取索引[0]的值来显示JSON对象中的数组？

我在下面列出的user.ts文件中有一个JSON对象“user”：

ngOnInit() {

    // initialize user model here
    this.user = {
        cardholder: '',
        place: '',
        site:'',
        building: '',
        group: '',
        justification: ''
    }
}  

在my page.component.html中，用户正在填写表单，其中一个组件是下拉菜单。下拉菜单被分配给JSON对象，我可以看到它是使用{user | JSON}概念分配的

<div>
    <label>Select A Site</label>
    <select name="site" [(ngModel)]="user.site">
        <option *ngFor="let site of sites" [ngValue]="site">  
            {{site.display}}
        </option>
    </select>
</div>

我知道站点是一个数组，索引[0]=值，索引[1]=显示

public sites = [
    { value: 'sunshine', display: 'Sunshine' },
];

---

如何仅获取索引[0]的值来显示JSON对象中的数组，而不获取与“user.site”关联的整个JSON对象

指定的是对象而不是字符串

解决方案1

<select name="site" [(ngModel)]="user.site">
    <option *ngFor="let site of sites" [ngValue]="site.value"> <===== site.value rather than site 
        {{site.display}}
    </option>
</select>

你能在codepen上发布一个模拟的链接吗？这里有一些令人困惑的地方。首先，this.user真的是json吗？它看起来像一个普通的物体。我不知道你所说的“我知道这个站点是一个数组，索引[0]=值，索引[1]=显示”是什么意思。Sites是ngFor将迭代以创建每个选项元素的数组，但site不是数组，也没有索引。除此之外，这可能很简单，只需将您的ngValue更改为指向“site.value”。这非常有效。[ngValue]=“site.value”，谢谢！
<select name="site" [(ngModel)]="user.site">
    <option *ngFor="let site of sites" [ngValue]="site.value"> <===== site.value rather than site 
        {{site.display}}
    </option>
</select>

<p><span class="step"> Step 3: </span> Site: {{user.site.value}}</p>