angular - 导出 const 值在下拉列表中未绑定
问题描述
我在单独的文件中有一个常量值并绑定下拉选项中的值,工作日工作正常但间隔时间将其绑定为对象对象这里是 constantvalues.ts
它工作正常
export const weekdays =['sunday','Monday','Tuesday','wednesday','thursday'];
不工作
export const IntervalTime =[{key:0,value:'10.00'},{key:1,value:'11.00'}];
组件.ts
import {Component,OnInit} from '@angular/core';
import {weekdays} from './constantvalues';
/**
* @title Basic select
*/
@Component({
selector: 'select-overview-example',
templateUrl: 'select-overview-example.html',
styleUrls: ['select-overview-example.css'],
})
export class SelectOverviewExample implements OnInit {
days=[];
//not working[![enter image description here][1]][1]
times =[];
ngOnInit(){
[...this.days] = weekdays;
[...this.times]=IntervalTime;
}
}
html:
<mat-form-field>
<mat-select placeholder="select Weekdays">
<mat-option *ngFor="let day of days" [value]="day">
{{day}}
</mat-option>
</mat-select>
</mat-form-field>
<hr/> Second Dropdrown with Array of object
<mat-form-field>
<mat-select placeholder="select Weekdays">
<mat-option *ngFor="let time of times" [value]="time">
{{time}}
</mat-option>
</mat-select>
</mat-form-field>
解决方案
对于你应该分配的时间time.value
,而不是整个对象
<mat-form-field>
<mat-select placeholder="select Weekdays">
<mat-option *ngFor="let time of times" [value]="time">
{{time.value}}
</mat-option>
</mat-select>
</mat-form-field>
分叉演示
推荐阅读
- node.js - 连接上游时出错。Docker 撰写,NodeJS,Nginx
- kubernetes - 有没有办法指定具有容器范围的 k8s PodSecuirtyPolicy?
- mysql - 从 MySQL 列每天减少 1 天
- javascript - 如何使输入占位符文本可编辑?
- amazon-s3 - Kafka 连接器记录写入器因缺少要分配的内存而卡在 S3OutputStream 中,但在几个小时内保持空闲状态并没有失败
- java - 将字符串转换为 HTTPEntity
- go - 如何正确处理丢失的变量恐慌?
- r - 将 group_modify 与选定的列一起使用(保留整个数据框和顺序)
- google-apps-script - Google Sheets to Slack 无法更新同一块
- r - 如何将字符串转换为R中的可执行代码?