0

を使用して、Angular の範囲入力の値を更新しようとしていますlocalStorage。

これは私のHTMLにあるものです：

input type="range" id="myRange" value={{audio.volume}}  min="0" max="1" step="0.01" ng-model="audio.volume" ng-change="adjustVolume()"

範囲の値を動的にしたい。

そして、これは私のjsです:

$scope.adjustVolume = function (){ 
  localStorageService.set("volume",$scope.audio.volume);
}

このようにして、キー「ボリューム」を に保存することができましたlocalStorageが、ページを更新すると、範囲のスライダーの位置が 1 に戻りますが、localStorageまだ他の数値に設定されています。

範囲の値をからの値と同じに保ち、範囲localStorageの位置を維持するにはどうすればよいですか。

4

2 に答える 2

0

コントローラ内でスコープ プロパティを初期化する場合は常に、localStorage の値を使用して $scope.audio.volume の値を割り当てる必要があります。例えば：

$scope.audio.volume = localStorageService.get("volume");

ただし、これは、プロパティ「オーディオ」を既に初期化している場合にのみ機能します。ボリュームが初期化したい「オーディオ」の唯一のプロパティである場合、初期化は次のようになります。

$scope.audio = {'volume':localStorageService.get("volume")};

したがって、コントローラーの例は次のようになります。

var myApp = angular.module('myApp',[]);

myApp.controller('MyAudioController', ['$scope', function($scope) {
  $scope.audio = {'volume':localStorageService.get("volume")};//<--THIS IS IMPORTANT
  $scope.adjustVolume = function (){ 
     localStorageService.set("volume",$scope.audio.volume);
  }
}]);
于 2016-06-22T16:57:22.860 に答える
0

変更があるたびに値を更新するウォッチ機能を使用して、この問題を解決しました。

         $scope.$watch(function(){
            $scope.audio.volume = localStorageService.get("volume");                
            return true;
        });
于 2016-06-29T09:07:35.237 に答える