gpt4 book ai didi

angularjs - Bootstrap 3 Angular 模式弹出窗口不处理移动设备上的触摸事件

转载 作者:行者123 更新时间:2023-12-02 23:24:57 25 4
gpt4 key购买 nike

Bootstrap3 和 Angular 应该能够很好地结合在一起......并且 Bootstrap 是“移动优先”,我从来没有想过我会遇到这种情况,但我确实遇到了。

我有一个从按钮弹出的模式窗口(通过标准 modalService),它在我测试过的桌面浏览器(IE 10、11、Edge、Chrome、Opera、Safari 和 Firefox)上运行良好)但在移动设备上失败。我可以访问的每部手机(IOS Chrome、IOS Safari、Android 互联网浏览器和 Android Chrome)。

它还在移动浏览器的 Chrome 模拟上显示相同的失败。

在移动设备上的所有情况下,单选按钮和复选框都无法识别点击/单击事件..除非我按住很长时间(比我在文章中提到的 300 毫秒长得多)。在一些捕获它的移动浏览器中 - 由更改引起的 Angular 操作不会在移动客户端上执行(而是在桌面上执行)

<input type="radio" class="form-control"  ng-Model="modalOptions.rScope.selectedItem" name="purchase" ng-value="selectedItem=item" ngClick="modalOptions.rScope.selectedItem=item">

ngTouch 已添加到页面中,以促进更快的 ngClick 事件。

我已经删除了所有相关代码并创建了一个显示此内容的 plunk:http://plnkr.co/edit/iZV6JRnHHHRwAKO2JJ06

这是如何定义单选按钮的函数吗?如果是这样,为什么复选框显示相同的行为(我知道它当前没有 ngClick - 但行为是相同的):

<input type="checkbox" class="form-control" width="20px" ng-model="modalOptions.rScope.xgiftfor" />

我没有收到任何错误,表明 ngTouch 模块未加载...

困扰我的一件事...... ngClick 的页面指出:

A more powerful replacement for the default ngClick designed to be used on touchscreen devices. Most mobile browsers wait about 300ms after a tap-and- release before sending the click event. This version handles them immediately, and then prevents the following click event from propagating.

ngTouch 是否会阻止 Angular 继续传播表单上的更新?当 modalOption.rScope.selectedItem 更新发生时,该点击事件将产生其他后果。

或者我是否正在努力寻找这种行为的原因?

[编辑]

我已经更新了 plunk 以在主页上显示相同的数据集(由于范围而稍微修改了代码),并且模式上的行为不存在于主页上。在您最喜欢的桌面浏览器中运行它,它在主页上运行良好 - 但打开模式,它就不起作用。

http://embed.plnkr.co/WnxArMU9VUVjDwnvueV1

有人知道引入干扰处理的模式是什么(以及如何解决它)吗?

最佳答案

我遇到了确切的问题。不幸的是,我只发现ngClick directive现在是deprecated没有解决方法。

DEPRECATION NOTICE: Beginning with Angular 1.5, this directive is deprecated and by default disabled. The directive will receive no further support and might be removed from future releases. If you need the directive, you can enable it with the $touchProvider#ngClickOverrideEnabled function. We also recommend that you migrate to FastClick. To learn more about the 300ms delay, this Telerik article gives a good overview.

关于angularjs - Bootstrap 3 Angular 模式弹出窗口不处理移动设备上的触摸事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32043207/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com