问题描述
使用primeNg下拉组件,我尝试使用初始值初始化该下拉列表,但没有成功,我使用的是反应式方法.
using primeNg dropdown component, I'm trying to initialized the dropdown with initial value with no success, I'm using reactive approach.
我检查了primeNg文档和演示-几乎所有示例都是使用模板驱动的,我希望模型驱动的示例也是如此.
I checked the primeNg documentation and demos - almost all the examples there are using template driven, I would like to have the same with model driven.
我可以使用列表中的值呈现下拉列表,但是所选项目不是我在表单中声明的项目,而是列表中的第一项.
I'm able to render the dropdown with the values in the list but the selected item is not the one I declared in the form, instead it's the first item in the list.
我的代码:模板
<div [formGroup]="formGroup">
<p-dropdown [options]="results"
formControlName="second"
(onChange)="onChangeHandler($event)"
optionLabel="label">
</p-dropdown>
</div>
组件
this.second = new FormControl('second');
this.formGroup= this.builder.group({
second: this.second
});
this.results = [];
this.results.push({ label: 'First Data', value: "first" });
this.results.push({ label: 'Second Test Data', value: "second" });
this.results.push({ label: 'Third Data', value: "third" });
请告知.
如果任何人都可以在模型驱动下共享primeNG下拉组件的工作示例,那就太好了.值应具有键值属性,例如在我的示例中.
If anyone can share a working example of primeNG dropdown component in model driven it would be great.The values should have key, value attributes like in my example.
推荐答案
由于名为second
的FormControl
是您的FormGroup
的一部分,因此实例化应在FormGroup
本身内部.考虑以下示例,
Since the FormControl
named second
is a part of the your FormGroup
, the instantiation should be inside the FormGroup
itself. Consider the following example,
this.formGroup= this.builder.group({
second: new FormControl('second')
});
这篇关于反应形式的Angular PrimeNG下拉组件-初始值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!