显示基于它的ID对象属性

问题描述 投票:1回答:2

我有分量叫list中,我会展示我所有customers list如下图:

enter image description here

和选择特定客户i将发出该客户ID和我将显示称为display另一个组件ID:

enter image description here

取而代之的显示customer id我怎么能显示该ID的属性(前名,电子邮件)是这样的:

enter image description here

DEMO

angular typescript angular6
2个回答
3
投票

而不是传递只有ID的,通过完整的对象上像这样的单击事件 -

(click)="selected($event, customer)"

并显示任何你想展示这样的 -

{{CustId?.id}} {{CustId?.name}}

Working Example


1
投票

你似乎是采用了棱角分明材质,下面的例子说明如何显示您希望在下拉列表中选择属性,并为选定的值,下拉之外。它使用值上mat-select结合所选客户绑定到selectedCustomer

const customers = [
  { id: 2, email: '[email protected]', name: 'Jack' },
  { id: 2, email: '[email protected]', name: 'John' }
];

<mat-form-field>
   <mat-select placeholder="Customer" [(value)]="selectedCustomer">
      <mat-option *ngFor="let customer of customers" [value]="customer.id">
        {{ customer.id }}
      </mat-option>
   </mat-select>
</mat-form-field>

<p>{{ selectedCustomer.name }} {{ selectedCustomer.email }}</p>
© www.soinside.com 2019 - 2024. All rights reserved.