如何解决反应形式的Angular PrimeNG Multiselect-在编辑操作期间从后端映射所选数据
我正在为Prime项目使用PrimeNg库。编辑某些内容时,从后端映射所选数据时出现问题。所选数据不会错误显示。以下是我的代码。请帮忙。
调用我的对话框并将数据发送到对话框-
async onEditContact(message: string) {
let res=await this.getContactById(48);
const dialogRef = this.dialog.open(ContactFormComponent,{
disableClose: true,width: '800px'
});
let instance = dialogRef.componentInstance;
instance.ContactForm=this.ContactForm;
instance.groupList=this.dataSourceGroups;
instance.response=res;
dialogRef.afterClosed().subscribe(result => {
console.log('The dialog was closed');
});
}
async getContactById(ContactId:number){
const sendobj:getContactById={
AccountId:this.globals.AccountId,ContactId:ContactId
};
let response=await this.contactGroupService.getContactById(JSON.stringify(sendobj));
return response;
}
在对话框中映射数据-
onEdit()
{
this.ContactForm.patchValue({
FirstName:this.response["FirstName"],LastName:this.response["LastName"],VoicePhoneNumber:this.response["SMSPhone"],SMSPhoneNumber:this.response["VoicePhone"],Email:this.response["Email"],groups:JSON.parse(this.response["Groups"])
});
}
选定数据的杰森-
多选控件-
<div style="width: 100%;">
<label for="groups">Contact Groups to Launch Campaign to (Optional)</label>
<p-multiSelect [style]="{'width':'100%'}" [maxSelectedLabels]="6" [options]="groupList" optionLabel="GroupName" formControlName="groups" defaultLabel="Click here to select contact groups">
</p-multiSelect>
</div>
用于绑定多选的接口-
export interface groupResponse {
GroupId: number;
GroupName: string;
AccountID: number;
ContactsCount:number;
CreatedDate:string;
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。