Angular 如何在从for循环获取值时将值从html传递到typescript

我正在开发混合应用程序使用离子2。我被困在从html到typescript的传递值中。在这个页面中，我从ion select设置了第一个select选项，并在ion选项中设置了for loop（ngFor）。在“选择选项”下面，我放置了将所选服务添加到数据库的按钮（按钮在ngFor之外，所以我无法将选项id发送到typescript），并且我已在值中设置了选项名称

我的代码在下面

服务类型
{{x.name}
添加服务

您可以执行以下操作：

服务类型
{{x.name}
添加服务

您可以执行以下操作：

服务类型
{{x.name}
添加服务

您能说得更清楚些吗？就像应该发生的事情一样，您希望传递什么？在addService（）中，您可以通过以下方式获得：this.serviceName.id

（单击）=“addService（serviceName）”

？否则，您为什么要使用

[（ngModel）]

？我想在单击“添加服务”按钮时传递x.name和x.id。您应该将整个内容包装成一个表单，并在使用该按钮提交时使用表单值。您能更清楚地说明吗？就像应该发生的事情一样，您希望传递什么？在addService（）中，您可以通过以下方式获得：this.serviceName.id

（单击）=“addService（serviceName）”

？否则，您为什么要使用

[（ngModel）]

？我想在单击“添加服务”按钮时传递x.name和x.id。您应该将整个内容包装到表单中，并在使用按钮提交时使用表单值。

<ion-item>
  <ion-label>Service type</ion-label>
  <ion-select [(ngModel)]="serviceName" >
    <ion-option value="{{x.name}}" *ngFor="let x of servicelist">{{x.name}}</ion-option>
  </ion-select>
</ion-item>

<button ion-button (click)="addService()"> Add service</button>