angular - 在选择选项中设置默认静态值
问题描述
我在设置select
标签的默认值时遇到问题。这是我的一些片段:
<select class="form-control" id="field_company" name="company" formControlName="company">
<option value="null" [selected]="true"> {{ 'khanbankCpmsApp.company.default' | translate }}</option>
<option
[ngValue]="companyOption.id === editForm.get('company').value?.id ? editForm.get('company').value : companyOption"
*ngFor="let companyOption of companies;"
>
{{ companyOption.name }}</option>
</select>
默认情况下,该静态值应显示在选择上。但结果是:
我做错了什么 ?有什么建议吗?
解决方案
您正在使用反应式表单,因此您需要将 FormControl 设置为您的 formGroup 之类的。
<form [formGroup]="companyGroup">
<select class="form-control" name="company" formControlName="company">
<option value="1"> One </option>
<option value="2"> Two </option>
<option value="3"> Three </option>
</select>
</form>
和 .ts 文件包含
export class HelloComponent implements OnInit {
@Input() name: string;
companyGroup: FormGroup;
constructor(private fb: FormBuilder) {
}
ngOnInit() {
this.companyGroup = this.fb.group({
company : ''
})
this.companyGroup.get('company').patchValue('2');
}
}
演示链接在这里
推荐阅读
- reactjs - ReactJS Material UI粘性页脚不起作用
- python - 尝试从文本文件中对列进行排序
- java - java - 在输入int,char和int时如何避免Java中的InputMismatchException
- laravel - 如何从laravel中的url中删除id
- reactjs - 尝试附加图像时出现 CORS 错误
- r - Reddit 抓取错误 HTTP 状态为“403 Forbidden”
- python - 在 python Pandas 中将对象转换为时间
- node.js - 这个包已被弃用,现在它只导出 makeExecutableSchema
- function - Kivy 多个切换按钮都在一个函数中读取
- javascript - 如何提交我的文本框值以转到 React js 中的链接?