更改聚焦元素的ng模型

时间:2018-06-27 08:04:25

标签: javascript jquery angularjs

我正在使用angularJS 1.5制作Web应用程序。用户将使用连接到网络的条形码扫描仪与网页进行交互。连接本身是通过一个websocket完成的,该websocket向我返回扫描的值。

我想做的是:

  • 检查哪个字段集中在屏幕上
  • 将此字段的值设置为扫描的条形码
  • 触发该字段的事件

这是我现在拥有的代码:

self.scannerSocket.onmessage = function (e) {
    // Get the scanned barcode from the event
    var obj = JSON.parse(e.data);
    var message = obj.Body.Values[0].Value;
    var value = message.replace(/ +(?= )/g,'');

    // Get the element which has focus on the screen
    var $focusedElement = $($document[0].activeElement);
    if(! $focusedElement || $focusedElement.is(":disabled")) return;

    // Set the new value of the element
    $focusedElement.val(value);

    // Trigger the enter event on the element
    $timeout(function(){
        var e = jQuery.Event("keypress");
        e.which = 13;
        e.keyCode = 13;
        $focusedElement.trigger(e);
    });
};

问题在于,更改元素的值不会更改此元素后面的ng-model。我当时想做这样的事情:

var model = $focusedElement.attr("ng-model");
$scope[model] = value;

但是问题是websocket的代码在服务中。因此没有$scope。另外,我的应用程序中有多个隔离的组件。每个都有自己的范围。扫描应该在屏幕上的所有输入字段上进行。

所以问题:如何更改元素后面的ng-model的值?

1 个答案:

答案 0 :(得分:0)

我能够使用

更新模型
        $focusedElement.trigger('input');
        $focusedElement.trigger('change');

解决方案在这里找到: Update Angular model after setting input value with jQuery