javascript - Call a changing variable from outside the function -

var slider = document.getelementbyid('test5'); nouislider.create(slider, {     start: [1366],     step: 1,     range: {         'min': 200,         'max': 1920     },     format: wnumb({         decimals: 0,         postfix: 'px',     }) });  var app = angular.module('myapp', []);  app.controller('mywidth', function ($scope) {     $scope.width = inputformat.value;      $scope.$watch('width', function (newvalue, oldvalue) {         console.log('old:' + oldvalue);         console.log('new:' + newvalue);     });     console.log($scope.width + ' - scope width'); }); var inputformat = document.getelementbyid('input-format'); editorcontainer = document.getelementbyid('editorcontainer'); slider.nouislider.on('update', function (values, handle) {     inputformat.value = values[handle];     //$(editorcontainer).css('width', values[handle]); }); inputformat.addeventlistener('change', function(){     slider.nouislider.set(this.value); }); 

i having problem getting value of inputformat on constant basis. happens run webpage/application , $scope.width variable gets first value of inputformat , stops. doesn't continue value after value of inputformat has changed. question how call inputformat variable in way $scope.width variable gets updated? new angular , javascript, , can understand question. help!

here part of html call $scope.width:

<div class="" <!--id="editorcontainer"--> style="position: absolute; top: 10px;    bottom: 10px; right: 10px; left: 10px; width: {{width}};" 

you should use ng-style , change $scope.width..