打字稿:在我的组件 class 中初始化接口后,将整个对象放在一个 属性 下
Typescript: Getting the entire object under one property after initializing the interface in my component class
在我的组件 class.
中初始化模型后,我从我的模型中获取整个对象 属性
Е这是我的 model/interface:
export interface CompanyDropDownItem {
CompanyAn: number;
CompanyCode: string;
CompanyName: string;
Inactive: boolean;
}
This is in my class implementing OnInit:
```typescript
companyDropdown: CompanyDropDownItem[];
selectedCompanyDropdown: CompanyDropDownItem =
{
CompanyAn: 0,
CompanyName: '',
CompanyCode: '',
Inactive:false
};
这是 edit
表单视图,其中值 CompanyAn
、CompanyName
和 CompanyCode
必须按 onChange
:
更新
<label for="CompanyName">Company</label>
<p-dropdown #selectedNewEmployee name="CompanyName" [options]="companyDropdown" placeholder="Select Company" optionLabel="CompanyName" appendTo="body" [virtualScroll]="true" [itemSize]="20" [filter]="true" [showClear]="true" [(ngModel)]="selectedCompanyDropdown (onChange)="getCompanyDetails(selectedCompanyDropdown)"></p-dropdown>
<div>
<p-button label="Save" icon="pi pi-check" (onClick)="onSaveEmployee(selectedNewEmployee.value)"></p-button>
</div>
这是 getCompanyDetails()
- WebEmployeeDetails
是一个更大的界面,值被插入其中:
getCompanyDetails(WebEmployeeDetail: CompanyDropDownItem) {
// PASSING IN ALL THE PROPERTIES FROM THE COMPANY CLASS
this.selectedEmployee.CompanyAn = WebEmployeeDetail.CompanyAn ;
this.selectedEmployee.CompanyCode = WebEmployeeDetail.CompanyCode;
this.selectedEmployee.CompanyName = WebEmployeeDetail.CompanyName;
// CHECKING THE VALUES ARE CHANGING WITH EACH CHANGE IN THE DROPDOWN
console.log('New CompanyAn is: ',this.selectedEmployee.CompanyAn);
console.log('New Company Code is: ',this.selectedEmployee.CompanyCode);
console.log('New Company Name is: ',this.selectedEmployee.CompanyName);
}
最后,这是onSaveEmployee()
:
onSaveEmployee(WebEmployeeDetail: WebEmployeeDetail): void {
this.div_visible = true; // progress bar start.
this.EmployeeService.onUpdateEmployee(WebEmployeeDetail)
.subscribe(
(data: WebEmployeeDetail) => setTimeout(()=>{ this.div_visible = false }, 1000, console.log(`${WebEmployeeDetail.PeopleId} updated succesfully`, data)),
(err: any) => console.log(err)
)
问题是您可以使用 Chrome 控制台看到图像 link 我正在 CompanyName
[=48= 下获取整个 selectedCompanyDropDown
对象].
如何只传递 CompanyName
属性 而不是整个对象?
Chrome Console
如果你只想从对象接收属性,你需要改变optionValue属性,像这样:
<p-dropdown #selectedNewEmployee name="CompanyName" optionValue="CompanyName" [options]="companyDropdown" placeholder="Select Company" optionLabel="CompanyName" appendTo="body" [virtualScroll]="true" [itemSize]="20" [filter]="true" [showClear]="true" [(ngModel)]="selectedCompanyDropdown (onChange)="getCompanyDetails(selectedCompanyDropdown)"></p-dropdown>
在我的组件 class.
中初始化模型后,我从我的模型中获取整个对象 属性Е这是我的 model/interface:
export interface CompanyDropDownItem {
CompanyAn: number;
CompanyCode: string;
CompanyName: string;
Inactive: boolean;
}
This is in my class implementing OnInit:
```typescript
companyDropdown: CompanyDropDownItem[];
selectedCompanyDropdown: CompanyDropDownItem =
{
CompanyAn: 0,
CompanyName: '',
CompanyCode: '',
Inactive:false
};
这是 edit
表单视图,其中值 CompanyAn
、CompanyName
和 CompanyCode
必须按 onChange
:
<label for="CompanyName">Company</label>
<p-dropdown #selectedNewEmployee name="CompanyName" [options]="companyDropdown" placeholder="Select Company" optionLabel="CompanyName" appendTo="body" [virtualScroll]="true" [itemSize]="20" [filter]="true" [showClear]="true" [(ngModel)]="selectedCompanyDropdown (onChange)="getCompanyDetails(selectedCompanyDropdown)"></p-dropdown>
<div>
<p-button label="Save" icon="pi pi-check" (onClick)="onSaveEmployee(selectedNewEmployee.value)"></p-button>
</div>
这是 getCompanyDetails()
- WebEmployeeDetails
是一个更大的界面,值被插入其中:
getCompanyDetails(WebEmployeeDetail: CompanyDropDownItem) {
// PASSING IN ALL THE PROPERTIES FROM THE COMPANY CLASS
this.selectedEmployee.CompanyAn = WebEmployeeDetail.CompanyAn ;
this.selectedEmployee.CompanyCode = WebEmployeeDetail.CompanyCode;
this.selectedEmployee.CompanyName = WebEmployeeDetail.CompanyName;
// CHECKING THE VALUES ARE CHANGING WITH EACH CHANGE IN THE DROPDOWN
console.log('New CompanyAn is: ',this.selectedEmployee.CompanyAn);
console.log('New Company Code is: ',this.selectedEmployee.CompanyCode);
console.log('New Company Name is: ',this.selectedEmployee.CompanyName);
}
最后,这是onSaveEmployee()
:
onSaveEmployee(WebEmployeeDetail: WebEmployeeDetail): void {
this.div_visible = true; // progress bar start.
this.EmployeeService.onUpdateEmployee(WebEmployeeDetail)
.subscribe(
(data: WebEmployeeDetail) => setTimeout(()=>{ this.div_visible = false }, 1000, console.log(`${WebEmployeeDetail.PeopleId} updated succesfully`, data)),
(err: any) => console.log(err)
)
问题是您可以使用 Chrome 控制台看到图像 link 我正在 CompanyName
[=48= 下获取整个 selectedCompanyDropDown
对象].
如何只传递 CompanyName
属性 而不是整个对象?
Chrome Console
如果你只想从对象接收属性,你需要改变optionValue属性,像这样:
<p-dropdown #selectedNewEmployee name="CompanyName" optionValue="CompanyName" [options]="companyDropdown" placeholder="Select Company" optionLabel="CompanyName" appendTo="body" [virtualScroll]="true" [itemSize]="20" [filter]="true" [showClear]="true" [(ngModel)]="selectedCompanyDropdown (onChange)="getCompanyDetails(selectedCompanyDropdown)"></p-dropdown>