Angular - how to change ng-model via controller?

Question

Angular

Good afternoon.
There are applications written in Angular, it has two fields input type="range" and input type="number" so that when you click on input type="number" the slider changes ( input type="range" ). Solved this problem like this

<div ng-app ng-controller="Ctrl">
    Range: <input type="range" ng-model="i" min="0" max="5" step=".5" /><br />
           <br />
    Number: <input type="number" ng-model="i" min="0" max="5" /><br />
    <br />
    i: {{i}}
</div>

An example here is jsfiddle.net/VFyFv
Well, my task has become more complicated, I use the fabricjs canvas library, and I need to change the slider when the object size changes ( input type="range" ) and because of this I cannot use the example above, because I can't put ng-model="i" on an object.
So the question is, can I change the slider without using ng-model, for example, something like this

function Ctrl($scope) {
    $("input[type=number]").change(function(){
        $scope.i = $("input[type=number]").val();
    })    
}

But this code unfortunately does not work.

Answer 1

Angular is such a bastard that he does not know about any asynchronous calls to anything if he did not make these calls himself.

$("input[type=number]").change(function(){
        $scope.i = $("input[type=number]").val();
    })

this code makes an asynchronous call to jquery. and when he does it, then the angular does not know that the scope has been changed. try something like this
$scope.someShitChange = function(){...}

Answer 2

Tell me, why do you need AngularJS? Or was the project inherited?
jsfiddle.net/GxqfK/1
The controller communicates with the views through $scope, this is essentially the abstraction level. Models and controllers don't know anything about how your view is rendered, they just provide data. But directives are more interesting - they can work with the DOM and encapsulate some kind of logic. For example, in my example, for the range input, a value is taken and converted to a number (it's not clear why this is not there out of the box ... well, that's not the point).
More details can be found in the documentation. I advise you to say goodbye to my example and realize everything that happens there.