如何为PrimeNG p下拉菜单设置默认值

本文介绍了如何为PrimeNG p下拉菜单设置默认值的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我在我的angular5应用程序中使用PrimeNG.我对p-dropdown有疑问

I am using PrimeNG in my angular5 app. I have issue with p-dropdown

问题

我有用于显示国家/地区的p-下拉菜单.我正确绑定了选择选项，在这里工作正常(此数据来自api)，但是我需要将此p下拉列表的默认选择选项设置为印度".

I have p-dropdown for showing countries. I bind the select options correctly there it works fine (this data coming from api), but I need to set default selected option for this p-dropdown as "India".

我将ng-model的值设置为印度，但这没有用.

I set up ng-model value as India but it didn't work.

我的dummyponent.html代码

my dummyponent.html code

<div class="form-group col-md-2"> <div> <label for="inputEmail4"> Select Country</label> <span style="color:red">*</span> </div> <p-dropdown name="country" [options]="countries" [(ngModel)]="applicant.country" placeholder="select country" (onChange)="getStatebyCountry(applicant.country,$event)" #country="ngModel" required> </p-dropdown> <span *ngIf="country.invalid && (country.dirty || country.touched)"> <span [hidden]="!country.hasError('required')" style="color:#ffa500">country is mandatory</span> </span> </div>

我的dummyponent.ts

my dummyponent.ts

export class dummyComponent implements OnInit { //variable declaration scope for all controller function applicant: any = {}; country: string; constructor() { } ngOnInit() { this.applicant.country = 'India'; } this.countries = []; // this.countries.push({ label: 'Select Country', value: '' }); //getallcountries this.UserService.getallcountries().subscribe(result => { console.log("countries" + result); thist = result; for (let i = 0; i <= thist.length; i++) { if (thist[i].id === 1) { this.countries.push({ label: thist[i].name, value: thist[i].id }); } } });

推荐答案

如果PrimeNG不知道将"selectedCountry"绑定到哪个字段，则可能导致这种情况.您用于下拉控件的国家"模型具有更多的键和值属性.

This may be caused if PrimeNG doesn't know to which field to bind the "selectedCountry", ie. your "countries" model for the dropdown control has more then key and value properties.

就我而言，我必须明确地告知"每个下拉字段值的属性为"value".我为此使用了p-dropdown dataKey属性.

In my case, I had to explicitly "tell" to each dropdown field that the property for values is "value". I used the p-dropdown dataKey property for this.

因此，在下拉控件中，我添加了以下内容:

So, in my dropdown control, I added something like this:

<p-dropdown dataKey="value" ></p-dropdown>

您可以在此处了解更多信息.

You can read more here.