Angular中Jquery修改input的值之后如何更新Model

来源：互联网发布：cat鞋子知乎编辑：程序博客网时间：2024/05/29 00:30

在开发angular程序中，有时候会用到jquery来修改input值，比如在做输入限制的时候，当复制粘贴字符到input框之后，需要对值进行改变再放入到input中。此时需要同步更新input上的ng-model。注意不要使用scope.$apply()，因为这个是model改变之后来更新view的。下面来看下具体方法。

function handlePaste(e) {    e.preventDefault();    var maxLength = $(this).attr('maxlength');    var clipboardData = '';    //IE    if (window.clipboardData) {        clipboardData = window.clipboardData.getData("Text");    } else {        clipboardData = e.originalEvent.clipboardData.getData("Text");    }    clipboardData = clipboardData.replace(/["\*\/\\\?<>:\|]/g, '');    if (null != maxLength && maxLength > 0) {        $(this).val(clipboardData.substr(0, parseInt(maxLength)));    } else {        $(this).val(clipboardData);    }    $(this).trigger('input'); // Use for Chrome/Firefox/Edge    $(this).trigger('change'); // Use for Chrome/Firefox/Edge + IE11}

通过手动触发input和change事件来使model发生改变

$(this).trigger('input'); // Use for Chrome/Firefox/Edge$(this).trigger('change'); // Use for Chrome/Firefox/Edge + IE11

0 0