使用jQuery更改文本输入值-Chrome扩展程序

Question

I am trying to change input value in particular web site from chrome extension. In order to do that I am using jQuery in my content script. It works in most of the cases, but I didn't manage to change value of the input when it is part of AngularJS view. I found the same problem when I use let say kendoUI. I am trying to set the value calling $('element').val('value') and then try to call blur and change event, but without any success. I went through may be 99% of the posts related to this topic, but still can't find working solution.

Answer 1

You just need to Call $scope.apply() in order to let angular know about updating the bindings. This is mainly because by default, angular doesn't know anything about the changes you are making in jQuery.

Below is a sample code, and here is a jsFiddle . Hope this helps.

app.controller('testCtrl', ['$scope', function ($scope) {

    $scope.changeValue = function() {
     $('#test').val("new Value");
        $scope.apply();
    }

  <div class="form-inline">
            <input type="text" id="test" value="test">
            <input type="submit" value="submit" ng-click="changeValue()">
  </div>