我在作为数据表 CRUD 方法的一部分的对话框中有 PrimeNG 选项列表，如果关闭对话框并且未单击保存按钮，我如何重置目标和源值。
我需要以不同的方式进行克隆吗？
<p-dialog
header="User Details"
[(visible)]="displayDialog"
[responsive]="false"
showEffect="fade"
[modal]="true"
width="600">
<div class="ui-grid ui-grid-responsive ui-fluid" *ngIf="user">
<div class="ui-grid-row">
<div class="ui-grid-col-4"><label for="userName">Username</label></div>
<div class="ui-grid-col-8"><input pInputText id="userName" [(ngModel)]="user.userName" /></div>
</div>
<div class="ui-grid-row">
<div class="ui-grid-col-4"><label for="firstName">First Name</label></div>
<div class="ui-grid-col-8"><input pInputText id="firstName" [(ngModel)]="user.firstName" /></div>
</div>
<div class="ui-grid-row">
<div class="ui-grid-col-4"><label for="lastName">Last Name</label></div>
<div class="ui-grid-col-8"><input pInputText id="lastName" [(ngModel)]="user.lastName" /></div>
</div>
<div class="ui-grid-row">
<div class="ui-grid-col-4"><label for="active">IsActive</label></div>
<div class="ui-grid-col-8">
<p-checkbox [(ngModel)]="user.active" binary="true"></p-checkbox>
</div>
</div>
<div class="ui-grid-row">
<div class="ui-grid-col-4"><label for="active">User Roles:</label></div>
</div>
</div>
<div class="ui-grid-row">
<div class="ui-grid-col-12">
<p-pickList [source]="userSourceRoles" [target]="userTargetRoles" sourceHeader="Available" targetHeader="Selected">
<ng-template let-appRole pTemplate="item">
<div>{{appRole.roleName}}</div>
</ng-template>
</p-pickList>
</div>
</div>
<p-footer>
<div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix">
<button type="button" pButton icon="fa-close" (click)="delete()" label="Delete"></button>
<button type="button" pButton icon="fa-check" (click)="save()" label="Save"></button>
</div>
</p-footer>
</p-dialog>
onRowSelect 和克隆方法
onRowSelect(event) {
this.isNew = false;
this.user = this.clone(event.data);
this.userTargetRoles = this.user.appRoles;
//don't include items in the source if in target
this.allRoles.forEach((allRole: AppRole) => {
let found = false;
this.userTargetRoles.forEach((role: AppRole) => {
if (allRole.appRoleId === role.appRoleId) {
found = true;
}
});
if (!found) {
this.userSourceRoles.push(allRole);
}
});
this.displayDialog = true;
}
clone(u: User): User {
let user = new User();
for (let prop in u) {
user[prop] = u[prop];
}
return user;
}
用户对象
export class User {
constructor(
public userName?: string,
public firstName?: string,
public lastName?: string,
public createdDate?: Date,
public lastUpdatedDate?: Date,
public active?: boolean,
public appRoles?: AppRole[],
public userId?: number) { }
}