首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

为什么当输入被触摸时,angular仍然显示false?

当输入被触摸时,Angular仍然显示false的原因可能是由于以下几个方面:

  1. 表单控件未正确绑定到Angular的表单模型:在Angular中,表单控件需要正确绑定到表单模型中的相应属性。如果绑定不正确,Angular可能无法正确检测到输入的触摸状态。请确保表单控件的ngModel指令或FormControl实例与表单模型中的属性正确绑定。
  2. 表单控件的触摸状态未正确更新:Angular会自动跟踪表单控件的触摸状态。当输入被触摸时,Angular会将相应的控件标记为"touched"。如果触摸状态未正确更新,可能是由于自定义的事件处理程序或其他代码逻辑导致。请确保在输入被触摸时,相应的控件的触摸状态被正确更新。
  3. 触摸事件未正确绑定到表单控件:如果输入是通过触摸事件进行的,需要确保触摸事件正确地绑定到表单控件上。可以使用Angular的事件绑定机制,将触摸事件与表单控件的相应方法或属性进行绑定。

总结起来,当输入被触摸时,Angular仍然显示false可能是由于表单控件未正确绑定、触摸状态未正确更新或触摸事件未正确绑定等原因导致的。需要仔细检查代码逻辑,确保表单控件和相关事件处理正确配置。如果问题仍然存在,可以进一步调试和排查可能的错误。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

AngularDart4.0 指南- 模板语法二 顶

模板表达式计算结果为trueAngular会添加类。 表达式为false,它将删除类。 <!...“结构指令”指南介绍了结构指令的深入细节,您将在其中学习以下内容: 为什么必须在指令名称前加上前缀星号(*)。 指令没有合适的宿主元素如何对元素进行分组。 如何编写自己的结构指令。...非true/false的值 isActive表达式返回true值,NgIf将HeroDetailComponent添加到DOM。...表达式为false,NgIf从DOM中删除HeroDetailComponent,销毁该组件及其所有子组件。 在Dart模式下,Dart期望布尔值(类型为bool的)为true或false。...NgIf为falseAngular从DOM中删除元素及其后代。 它摧毁了他们的组件,潜在地释放了大量的资源,从而带来了更加快速的用户体验。 展示/隐藏技术适合少数几个后代的元素。

30K20

AngularDart 4.0 高级-生命周期钩子 顶

构造函数本身不是一个Angular钩子。 日志确认输入属性(在这种情况下的name属性)在构造没有分配的值。...Angular团队负责人Misko Hevery解释了为什么您应该避免使用复杂的构造函数逻辑。 不要在组件构造函数中获取数据。您不应该担心当在测试下创建或决定显示之前时新组件会尝试联系远程服务器。...教程和HTTP章节显示了如何。 还要记住,指令的数据绑定输入属性在构建之后才会设置。 如果您需要根据这些属性初始化指令,那么这是一个问题。 ngOninit运行时,它们将被设置。...日志条目显示为power属性更改的字符串值。 但ngOnChanges并没有捕捉到hero.name的变化,这一开始令人惊讶。 输入属性的值改变Angular只会调用钩子。...英雄或权力没有实质性变化时,它会向日志中写入特殊消息,以便您可以看到DoCheck多次调用。 结果是高亮的: ?

6.2K10
  • AngularJS 中使用Swiper制作滚动图不能滑动

    Swiper是目前较为流行的移动端触摸滑动插件,因为其简单好用易上手,受到很多前端开发者的欢迎。...的时候遇到这个问题: 使用angularjs动态循环生成swiper-slide类,在swiper-wrapper里生成6个以上的滑动页,可是就是划不到第二页,尝试将longSwipesRatio的值修改到最小,仍然不起作用...而在angular始终在swiper初始化之后定义,swiper则无法正确scan有多少个slide(实际上找到一个待循环模板),所以划不动。 找到原因后,只须对症下药。...在查阅Swiper的API发现,有这样两个参数:observer和observeParents,前者启动动态检查器,改变swiper的样式(例如隐藏/显示)或者修改swiper的子元素,自动初始化...两者默认值都为false。 所以在原来的swiper初始化代码中加上这两行即可。

    1.8K50

    Flutter完整开发实战详解(二十、 Android PlatformView 和键盘问题)

    image 如上图所示,简单来说就是原生控件的内容绘制到内存里,然后 Flutter Engine 通过相对应的 textureId 就可以获取到控件的渲染数据并显示出来。...但是,Android 平台并不支持这种模式,因为在 iOS 上框架渲染后系统会有回调通知,例如: iOS 视图向下移动 2px ,我们也可以将其列表中的所有其他 Flutter 控件也向下渲染 2px...类似可见:《Flutter完整开发实战详解(十三、全面深入触摸和滑动原理)》 触摸成功时会向 Android embedding 发送一条消息,其中包含 touch 事件的详细信息。...这意味着 Android 需要 IMM ,VirtualDisplay 仍然会使用 Flutter View 的 IMM 作为代理。...要求 AndroidView 提供 InputConnection ,它会检查 AndroidView 是否确实是输入的目标。

    13.4K20

    AngularDart 4.0 高级-结构指令 顶

    条件为false,NgIf从DOM中删除它的宿主元素,将它从DOM事件(它所依附的)中分离出来,将组件从Angular变化检测中分离出来并销毁它。 组件和DOM节点可以垃圾收集并释放内存。...为什么要移除而不是隐藏? 指令可以通过将其显示样式设置为无隐藏不需要的段落。...NgSwitchCase的值与switch的值匹配,会显示它的宿主元素。没有同级NgSwitchCase匹配switch的值,NgSwitchDefault显示它的宿主元素。...虽然很少有理由在模板属性或元素形式中应用结构指令,但了解Angular创建并了解它的工作原理仍然很重要。 当你编写自己的结构指令,你会参考。...UnlessDirective在条件为false显示内容。

    16.1K20

    AngularDart4.0 指南- 表单 顶

    跟踪控制状态 Angular表单控件可以告诉您用户是否触摸了该控件,值是否改变,或者该值是否失效。...touched和untouched指示控件是否访问过。 valid反映了控制值的有效性。 样式控件 有效的控制属性是最有趣的,因为一个控制值无效,你想发送一个强烈的视觉信号。...为什么“ngForm”? 指令的exportAs属性告诉Angular如何将引用变量链接到指令。...有些开发人员希望仅在用户进行无效更改时显示消息。 控件是“原始的”隐藏消息实现了这个目标。 您向表单添加一个“清除”按钮,您会看到此选项的重要性。...您将看到表格中显示的英雄模型值(只读)。 ? 该视图包含一个编辑按钮,其单击事件绑定将清除提交的标志。 您单击编辑按钮,该表消失,并且可编辑的表单重新出现。

    17.5K30

    AngularDart4.0 指南- 依赖注入 顶

    组件的每个新实例都会去获得它所包含的服务实例,组件实例销毁,服务实例也销毁。...组件子注入器 例如,Angular创建一个具有@Component.providers的组件的新实例,它也为该实例创建一个新的子注入器。...Angular销毁这些组件之一的实例,它也会销毁该组件的注入器和注入器的服务实例。 由于注入器继承,您仍然可以将应用程序范围的服务注入到这些组件中。...旧组件使用OldLogger记录消息,您需要NewLogger的单例实例来替换它。 组件要求输入新的或旧的记录器,依赖注入器应该注入该单例实例。...HeroService不会直接访问用户信息来决定谁授权,谁不授权。 相反,HeroService构造函数需要一个布尔标志来控制秘密英雄的显示

    5.7K20

    Android Focusable in Touch Mode 介绍

    当我们用手触摸屏幕选中内容后,会进入 Touch Mode; 但是当我们用触摸球左右移动(按下遥控器方向键也一样),就会离开 Touch Mode; 听起来似乎很简单,但是一个控件还有其他状态,这些状态切换...为什么会这样呢?...→_→ Focusable in Touch Mode 一般情况下在 touch mode 时会退出 focused 状态,但是在有些情况下我们希望在 touch mode 仍然保持 focused...EditText 默认 focusableInTouchMode 为 true,因此我们点击后它才能获取焦点,当我们设置 EditText focusableInTouchMode 为 false ,...当我们设置 ListView 的 focusableInTouchMode 为 false ,它的 item 也无法获取不到焦点,这在有的场景下会有用处。

    1.6K60

    JS中的touch事件与canvas绘图

    Touch事件分类 touchstart:手指触摸屏幕触发。...shiftKey boolean 如果事件发生按下了 shift 键则为 true,否则为 false altKey boolean 如果事件发生按下了 alt 键则为 true,否则为 false...两个手指触摸相同元素,targetTouches和touches的值相同,否则targetTouches 只有一个值。 changedTouches此时只有一个值,为第二个手指的触摸点。...Touch.target 这个触点最开始跟踪(在 touchstart 事件中), 触点位于的HTML元素....因此, 如果有元素在触摸过程中可能移除, 最佳实践是将触摸事件的监听器绑定到这个元素本身, 防止元素移除后, 无法再从它的上一级元素上侦测到从该元素冒泡的事件.

    7.5K41

    再谈angularJS数据绑定机制及背后原理—angularJS常见问题总结

    浏览器接收到可以 angular context 处理的事件,$digest 循环就会触发,遍历所有的 $watch,最后更新 dom。...该button点击,AngularJS会将此function包装到一个wrapping function中,然后传入到$scope.$apply()。... $digest 循环结束,DOM 相应地变化。 脏检查如何触发? angular 会在可能触发 UI 变更的时候进行脏检查:这句话并不准确。...所以说不要怀疑用户在输入表单 angular 会不会监听页面左边导航栏的变化。 如何优化脏检查与运行效率 脏检查慢吗? 说实话脏检查效率是不高,但是也谈不上有多慢。简单的数字或字符串比较能有多慢呢?... ng-if 变为 false,ng-if 下的 scope 销毁,注册在这个 scope 里的绑定表达式也就随之销毁了。

    7.8K40

    现代浏览器探秘(part4):事件处理

    从浏览器的角度看输入事件 当你听到“输入事件”,可能只会想到在文本框打字或鼠标单击,但从浏览器的角度来看,输入意味着来自用户的所有动作。 鼠标滚轮滚动是输入事件,触摸或者鼠标移动也是输入事件。...发生类似在屏幕上的触摸的用户动作,浏览器是最先先接收到动作的进程之一,但是浏览器进程只知道该动作发生的位置。...即使你的应用不关心页面中某些部分的输入,合成器线程也必须与主线程通信,并且在每次输入事件进入时都要等待它。因此合成器的平滑滚动能力破坏了。 ?...查找事件目标 合成器线程向主线程发送输入事件,首先要做的是命中测试以查找事件目标。 命中测试查找事件发生的坐标之下的内容,它使用在渲染进程中生成的绘制记录数据来完成这一使命。 ?...对于输入来说,典型的触摸屏设备每秒发送60-120次触摸事件,而典型的鼠标每秒发送100次事件。 输入事件具有比屏幕刷新更高的保真度。

    1.3K20

    现代浏览器内部机制(四): 换个角度看事件

    从浏览器的角度定义输入事件 提到“输入事件”,你可能会想到在文本域中打字或是鼠标的点击事件,但在浏览器看来,用户的任何动作都意味着“输入”。...鼠标滚轮的滚动是一种输入事件,触摸或者鼠标滑过也是一种输入事件。...非快速滚动区域 因为运行 JavaScript 是主线程的任务,一个页面合成,合成器线程将页面上挂在了事件处理器的区域标记为“非快速滚动区域”。...这等同于告诉浏览器开发者仍然希望在主线程中监听页面上每一次触发的输入事件,但也希望合成器该干啥干啥,持续合成新的帧。... sync-script:none 打开,会阻塞解析的 JavaScript 都会被阻止执行。这一策略会防止任何“脚本阻塞解析”的发生,浏览器就再也不用担心解析阻塞这件事情了。

    1K20

    为什么现在的开发者总是拿 Vue.js 和 JavaScript 巨头 Angular、React 比较?

    本文会试图揭示为什么开发者越来越相信 Vue.js 将会成为顶级的 JavaScript 库,为什么 Vue 将会让 Angular 和 React 望尘莫及。 ?...开发者在使用 Angular 的时候这两者的区分会令人非常困惑。 由于 Vue 没有使用脏检测,所以“性能比 Angular1 更好”。...存在大量 watcher 的时候,任何变化都会触发所有 watcher,所以 Angular1 的性能会降低。...Angular2 使用“组件”替换掉了之前的“控制器”。 Angular2 在 JavaScript 舞台上俨然已经成为了一个大腕儿,但是在某些场景下,Vue2.0 仍然个更好的选择。...但是,也不要忘了,Angular 和 React 在 JavaScript 世界里仍然赫赫有名,而 Vue 才刚刚崛起。

    1.9K30

    Angular2 之 结构型指令几个概念

    隐藏元素的利弊 当我们隐藏元素,组件的行为还在继续。 它仍然附加子啊它所属于的DOM元素上,它仍然在监听事件。angular会继续检查哪些能影响数据绑定的变更。...组件原本要做的哪些事情仍然在进行!它还是占用着那么多的资源。 另外一方面,重新显示这个组件会很快。 组件以前的状态保留着,并随时可以显示。... 移除元素组件 利 把ngIf设置为false,将会影响到组件的资源消耗。angular会从DOM中移除该元素,停止相关组件的变更检测,把它从DOM事件中移除,并且销毁组件。...ngIf重新变成true的时候,angular会重新创建该组件及其子树。angular会重新运行每个组件的初始化逻辑。... 这时候显示的内容是'Hip! Hooray!',在Angular的控制下,DOM的效果是不同的。 ?

    3K20

    WPF 高性能笔

    为什么 Stylusplugin 可以做到高性能? 这个需要从触摸开始讲。在我的另一篇博客有告诉大家从触摸到事件,在 WPF 是通过触摸线程拿到触摸信息。...这里判断命中测试和 WPF 说的命中测试使用的不是同相同的方法,这里只是简单获取每个界面元素的矩形,然后用触摸的点坐标判断是否在这个矩形内,也就是不判断元素是否其他的元素挡住。...这是就为什么使用 StylusPlugin 的获取输入性能比较快。...那么StylusPlugIn为什么会比较快,原因是 StylusPlugIn 没有经过那么多处理,也没有经过隧道,而且他可能还不在主线程,不管主线程写了多少代码,他这个线程都不会被影响。...如果需要加入到 StylusPlugIn 首先需要继承 StylusPlugIn 先创建一个类 TtkSwvlypxm 继承 StylusPlugIn ,那么可以通过重写获得 OnAdded 添加

    43030

    WPF 高性能笔

    为什么 Stylusplugin 可以做到高性能? 这个需要从触摸开始讲。在我的另一篇博客有告诉大家从触摸到事件,在 WPF 是通过触摸线程拿到触摸信息。...这里判断命中测试和 WPF 说的命中测试使用的不是同相同的方法,这里只是简单获取每个界面元素的矩形,然后用触摸的点坐标判断是否在这个矩形内,也就是不判断元素是否其他的元素挡住。...这是就为什么使用 StylusPlugin 的获取输入性能比较快。...那么StylusPlugIn为什么会比较快,原因是 StylusPlugIn 没有经过那么多处理,也没有经过隧道,而且他可能还不在主线程,不管主线程写了多少代码,他这个线程都不会被影响。...如果需要加入到 StylusPlugIn 首先需要继承 StylusPlugIn 先创建一个类 TtkSwvlypxm 继承 StylusPlugIn ,那么可以通过重写获得 OnAdded 添加

    75840
    领券