代码之家 › 专栏 › 技术社区 › Kumara

使用angular ngFor的角度循环json嵌套数据

angular javascript

Kumara · 技术社区 · 4 年前

  timeslots: [
{
  "hour": "10",
  "slotArr": ["00", "10", "20", "50"]
},
{
  "hour": "11",
  "slotArr": ["10", "30", "50"]
},
{
  "hour": "01",
  "slotArr": ["00", "10", "20", "30", "40", "50"]
}

]

我试着用下面的代码来循环这个。但不起作用

<select class="form-control" [(ngModel)]="checkin.hours"
                                                        name="hours">
                                                        <option *ngFor="let x of timeslots" [value]="x.hour">
                                                            {{x.hour}}
                                                        </option>
                                                    </select>

我需要使用两个下拉列表加载这些小时和慢行数据。我怎么做才对

1 回复 | 直到 4 年前

tmsbrndz 4 年前

您的对象分配不正确。如果你改变了 : 到 = ,代码将正常工作。

timeslots = [
    {
      hour: '10',
      slotArr: ['00', '10', '20', '50']
    },
    {
      hour: '11',
      slotArr: ['10', '30', '50']
    },
    {
      hour: '01',
      slotArr: ['00', '10', '20', '30', '40', '50']
    }
  ];

推荐文章

Reegan · 使用Angular ngFor指令在html中渲染嵌套对象值

4 月前

user3472810 · Angular@Output/EventEmitter返回undefined

4 月前

Lorenzo Bertolaccini · 在Angular项目中通过对话框后,在控制台中显示但在HTML中不显示的数据数组

4 月前

Jihed Ben Zarb · 造型角材料日期选择器

5 月前

st_clair_clarke · 为angular v19资源API创建可重复使用的加载器,其中包含2个不同类型的请求参数

5 月前

Ajay Kulkarni · Angular 19-重新路由到子路由未按预期工作

5 月前

Ajay Kulkarni · 路由器与导航上的路线不匹配

5 月前

Jace Johnson · Typescript文件读取的变量类型错误

5 月前

Ole · Angular资源API是否支持为资源添加初始值?

5 月前

Ole · 在使用新的Angular Resource API时取消搜索术语?

5 月前