程序笔记   发布时间:2022-05-30  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了[笔记]$watch监听input,输入空格不触发回调问题大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。

利用$watch监听input中输入的值,当输入空格时,回调函数没有触发,导致无法限制空格的输入问题。

一、现象

<body ng-controller="exerciseController">
    <input type="text" ng-model="txt" >
</body>
angular.module('app',[]).controller('exerciseController',function($scope){
    $scope.txt = '';
    $scope.$watch('txt',function(newValue,oldValue) {
        console.log('newValue',newValue);
        console.log('oldValue',oldValue);
    });
});

给input双向绑定了一个txt的变量,然后监听他的变化。

输入空格,控制台并没有打印,输入字符却有。在两个字符之间输入空格,也是有打印的,可以判定,触发回调时进行对比的值是会经过trim(去前后空格)方法的。

二、ng-trim

因此,我们不需要angular为我们进行trim操作,所以我们只要在input中添加属性 ng-trim=”false”。

<input type="text" ng-model="txt" ng-trim="false">

这样的话,即使输入空格也是有响应的。

大佬总结

以上是大佬教程为你收集整理的[笔记]$watch监听input,输入空格不触发回调问题全部内容,希望文章能够帮你解决[笔记]$watch监听input,输入空格不触发回调问题所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: