Ionic2 没有确定和取消的离子选择 [英] Ionic2 Ion-select without OK and Cancel

问题描述

我已经构建了一个 Ionic2 应用程序，我目前正在尝试改进 UX.为此，我收到了一些反馈，让我思考是否有一种方法可以让我

I have built an Ionic2 app and I am currently trying to improve the UX. To do that, I received some feedback that made me think of whether there is a way of having a

    <ion-select>
      <ion-option>
      </ion-option>
    </ion-select>

点击后，会立即给我输出，而不是等待用户按下离子操作表(http://ionicframework.com/docs/v2/api/components/select/Select/) 使用默认.

which upon tapped on, would give me the output straight away and not wait for the user to press on the currently appearing 'OK'and 'CANCEL' buttons that the ionic action sheet(http://ionicframework.com/docs/v2/api/components/select/Select/) uses by default.

任何建议将不胜感激！:)

Any suggestions will be greatly appreciated! :)

正如@sebaferrreras 所建议的，

As @sebaferrreras has suggested,

如果选项数量超过6个，即使action-sheet通过，也会使用alert界面.

因此，如果您需要使用 6 个以上的选项，则目前必须找到解决方法，此功能未列出在Ionic2 文档.

So if you need to use more than 6 options, you are going to have to find a workaround as for the moment, this functionality is NOT listed under the Ionic2 docs.

推荐答案

更改选择元素中使用的 API(通过使用 ActionSheet API) 可能是一个选项.

Changing the API used in the select element (by using the ActionSheet API) could be an option.

为此，您只需在 ion-select 元素中添加 interface="action-sheet".

In order to do that, you only need to add interface="action-sheet" in the ion-select element.

  <ion-item>
    <ion-label>Gender</ion-label>
    <ion-select interface="action-sheet">
      <ion-option value="f" selected="true">Female</ion-option>
      <ion-option value="m">Male</ion-option>
    </ion-select>
  </ion-item>

我不确定这是否是您应用中的有效选项(就用户体验而言).

I'm not sure if that's a valid option (in terms of UX) in your app.

就像您可以在 Ionic 中找到的一样2 个文档

如果选项数量超过6个，就会使用alert接口即使通过了行动表.

If the number of options exceed 6, it will use the alert interface even if action-sheet is passed.

这篇关于Ionic2 没有确定和取消的离子选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！