【问题标题】:ngx-chips tag-input-dropdown does not show autosuggest in iPhonengx-chips tag-input-dropdown 在 iPhone 中不显示自动建议
【发布时间】:2025-12-11 22:55:03
【问题描述】:

我已经为电子邮件抄送字段实现了 ngx-chips。它在我使用 Chrome 的 Android 手机中完美运行。但是,在 iPhone 中,自动建议不会出现。

<div class="required form-group col-md-12 col-sm-12 col-xs-12" >
    <label class="control-label" for="email.emailCc">CC:</label>
       <tag-input [(ngModel)]="emailList"  [onlyFromAutocomplete]="true" theme='bootstrap'>
        <tag-input-dropdown [autocompleteObservable]="items" [showDropdownIfEmpty]="true" [dynamicUpdate]="false">
        </tag-input-dropdown>
       </tag-input>
 </div>

在 Iphone 中

在 Android 中

请帮忙。

【问题讨论】:

    标签: angular7 ngx-chips


    【解决方案1】:

    在 global.scss 中为 IOS 添加以下行以显示下拉内容,

    div.ng2-dropdown-menu.ng2-dropdown-menu---width--4.ng2-dropdown-menu--open {
      display: block !important; // to display the drop down content
      max-height: 40vh !important;  // for scrolling of suggestion list
    }
    

    但它仍然不如在 android 上好。滚动屏幕会随之滚动列表。

    【讨论】:

    • 他们已经打开了关于 safari 的问题,所以我认为它将在未来的版本中修复,直到那时我们可以像这样使用它
    【解决方案2】:

    我们面临同样的问题。问题不在于显示的数据,而是由于 iPhone 中文本框的缩放而导致下拉列表的位置。通过 css hack,我们能够将下拉菜单放置在适当的位置。

    【讨论】:

    • Nayana,你能提一下那些css hack吗?我尝试了很多都无济于事,最后放弃了这个自动完成。
    最近更新 更多