Question

我有一个带有动态离子选择功能的离子选择器。我的任务是在选择5个以上结果时禁用离子选择的保存按钮。我发现ionSelect事件每次在ion-select中单击复选框时都会调用控制器方法。

我的代码：

HTML：

<ion-select [(ngModel)]="users" multiple="true">
      <ion-option value="{{t.userId}}" *ngFor="let t of possibleUsers" (ionSelect)="onUserSelect()">{{t.userName}}</ion-option>
</ion-select>

TS：

public onUserSelect(value) {
 console.log(value);
}

我如何在onUserSelect方法中看到值参数是选定的复选框值，并且在选中或取消选中它之前。因此，如果没有选择器，我将无法判断使用javascript单击了哪个复选框。

我无法尝试向ion-option添加任何选择器，

[custom-data]="t.userId", class="my-class", id="customId-{{t.userId}}", data-custom="customId-{{t.userId}}"

但是它们都不添加到离子选择中。

有什么想法如何在ion-option中添加唯一选择器，或者如何在ionSelect事件中发送复选框状态？

Answer 1

希望这是您期望的

  onUserSelect(value) {
    console.log(value);
  }

<ion-select [(ngModel)]="users" multiple="true">
      <ion-option value="{{t.userId}}" *ngFor="let t of possibleUsers" (ionSelect)="onUserSelect(t.userId)">{{t.userName}}</ion-option>
</ion-select>
<!-- if this is your save button -->
<button ion-button [disabled]="users.length > 5">Save</button>

用于离子选择的Ionic 3自定义选择器

1 个答案: