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

在开发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
}

通过手动触发inputchange事件来使model发生改变

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

你可能感兴趣的:(Javascript,AngularJs)