angularjs - 入力[type = range]の値が更新されない

Question

入力タイプの範囲に奇妙な問題があります。値を強制的に変更しても値は更新されません。私は角でイオン1を使用しています

私は日付と入力範囲のスライダーの下にあるボタンのリストを持っています。

... 
<a grouped-radio="date" ng-model="data.date" ng-repeat="date in data.dates" class="button-small" ng-click="updateTimeRange(date)">{{date | date: 'd-MMM'}}</a> 
... 
<input type="range" id="time" name="time" min="{{data.minTimeStep}}" max="{{data.maxTimeStep}}" step="0.5" value="{{data.timeStep}}" 
       ng-model="data.timeStep" ng-change="getTime()"> 
... 

ボタンをクリックします。関数updateTimeRange（）を呼び出して、以下の入力範囲の最小値と最大値をリセットします。ここにはupdateTimeRange（）関数があります

$scope.updateTimeRange = function (selectedDate) { 

     var timeobj = _getMinTime(selectedDate); //function to get minimum time for the selected date 

     //updating the scopes but it does not work 
     $scope.data.minTimeStep = timeobj.decimal; 
     $scope.data.timeStep = timeobj.decimal; 
     $scope.data.time = timeobj.time; 

     //tried force update the value directly but does not work also. 
     //document.querySelector('#time').value = timeobj.decimal; 
     $timeout(function() { 
      console.log('timeout value: '+document.querySelector('#time').value); 
     }); 

     console.log(timeobj); 
     console.log($scope.data); 
     console.log(document.querySelector('#time').value); 
    } 

ここはコンソール出力です。それは全く意味をなさない。

私はコンソールで手動で設定しようとしたが

、それは大丈夫そうです。ネストされたオブジェクトが問題を引き起こしている

$scope.minTimeStep = timeobj.decimal; 

代わり

$scope.data.minTimeStep = timeobj.decimal; 

の

Answer 1

私はハックしました。私はそれを$ timer関数で強制的に更新します。どうしてか分かりません。それは私のために働く。

$scope.updateTimeRange = function (selectedDate) { 

    var timeobj = _getMinTime(selectedDate); //function to get minimum time for the selected date 

    //updating the scopes but it does not work 
    $scope.data.minTimeStep = timeobj.decimal; 
    $scope.data.timeStep = timeobj.decimal; 
    $scope.data.time = timeobj.time; 

    //tried force update in the timer 
    $timeout(function() { 
     console.log('timeout value: '+document.querySelector('#time').value); 
     document.querySelector('#time').value = timeobj.decimal; 
    }); 

    console.log(timeobj); 
    console.log($scope.data); 
    console.log(document.querySelector('#time').value); 
} 

Answer 2

試行に使用します。あなたのjavascriptとhtmlからデータを削除するだけです。