点击/单击选择元素，使用Ionic Framework在移动设备上无效

Question

我有一个简单的选择元素来选择应用语言。这是视图代码：

<ion-view title={{i18n.settings.title}}>
  <ion-nav-buttons side="left">
    <button menu-toggle="left" class="button button-icon icon ion-navicon"></button>
  </ion-nav-buttons>
  <ion-content >
    <div class="list">
      <label class="item item-input item-select">
        <div class="input-label" >
          {{i18n.settings.select_language}}
        </div>
        <select class="ion-input-select" ng-model="language" ng-change="changeLanguage(language)">
          <option value="es">{{i18n.settings.spanish}}</option>
          <option value="en">{{i18n.settings.english}}</option>
        </select>
      </label>
    </div>
  </ion-content>
</ion-view>

预期结果当然是，点击选择并显示选项：

如果我在桌面浏览器中打开应用程序（我正在使用Chrome）并使用鼠标单击选择，它的效果非常好。

问题是，我有一台触摸屏笔记本电脑，所以如果我尝试用手指点击选择它不起作用。如果我在移动设备（Android 6）浏览器中打开应用程序（也使用Chrome），也会出现同样的情况。

更具体地说，只有当我用手指轻敲我在附加图像中标记的红色矩形时，它才有效，但如果我在选择元素的其余部分上面，则不行。< / p>

注1 ：此视图没有任何可能与选择行为产生冲突的CSS。 注意2 ：我在控制台上没有收到任何错误

离子版：1.1.0

Answer 1

似乎在将Ionic Framework版本从1.1.0更新为1.3.2 之后，错误已得到修复。

现在它在每个配置中都能正常工作：触摸屏笔记本电脑，桌面浏览器，移动设备浏览器和Android APK

Answer 2

我认为你应该改变div：

 <div class="input-label" >
          {{i18n.settings.select_language}}
        </div>
        <select class="ion-input-select" ng-model="language" ng-change="changeLanguage(language)">
          <option value="es">{{i18n.settings.spanish}}</option>
          <option value="en">{{i18n.settings.english}}</option>
        </select>

用文本标记并选择控制：

<label class = "item item-input item-select">
   <div class = "input-label">
       {{i18n.settings.select_language}}
   </div>

   <select class="ion-input-select" ng-model="language" ng-change="changeLanguage(language)">
              <option value="es">{{i18n.settings.spanish}}</option>
              <option value="en">{{i18n.settings.english}}</option>
            </select>
</label>