localStorage value doesn't want to be set - angularjs

Question

I have problem with set values in localStorage. I use AngularJS and Electron. When I update refreshTime, values for errors and opacity are set to null. Why?
$scope.storageLang = localStorage.getItem("language");
$scope.storageMonitors = localStorage.getItem("monitors");
$scope.storageAlarm = localStorage.getItem("alarm");
$scope.storageErrors = localStorage.getItem("errors");
$scope.storageDomain = localStorage.getItem("domain");
$scope.storageOpacity = localStorage.getItem("opacity");
$scope.refreshTime = localStorage.getItem("refreshTime");
$scope.submit = function($event) {
$event.preventDefault();
localStorage.setItem("domain", $scope.storageDomain);
localStorage.setItem("language", $scope.storageLang);
localStorage.setItem("monitors", $scope.storageMonitors);
localStorage.setItem("alarm", $scope.storageAlarm);
localStorage.setItem("errors", $scope.storageErrors);
localStorage.setItem("opacity", $scope.storageOpacity);
localStorage.setItem("refreshTime", $scope.refreshTime);
};
In HTML all my inputs has ng-model="storageLang" etc...
<form ng-submit="submit($event)" style="overflow:hidden">
<div class="field">
<label>{{ lang.domain }}</label>
<input type="text" ng-model="storageDomain" value="{{ storageDomain }}">
</div>
<div class="field">
<label>{{ lang.language }}</label>
<select ng-model="storageLang">
<option value="de" ng-selected="storageLang=='de'">Deutsch</option>
<option value="en" ng-selected="storageLang=='en'">English</option>
<option value="pl" ng-selected="storageLang=='pl'">Polski</option>
</select>
</div>
<div class="field">
<label>{{ lang.monitors }}</label>
<select ng-model="storageMonitors">
<option value="1" ng-selected="storageMonitors==1">1</option>
<option value="2" ng-selected="storageMonitors==2">2</option>
<option value="3" ng-selected="storageMonitors==3">3</option>
<option value="4" ng-selected="storageMonitors==4">4</option>
</select>
</div>
<div class="field">
<label>{{ lang.alarm }}</label>
<select ng-model="storageAlarm">
<option value="1" ng-selected="storageAlarm=='1'">{{ lang.yes }}</option>
<option value="0" ng-selected="storageAlarm=='0'">{{ lang.no }}</option>
</select>
</div>
<div class="field">
<label>{{ lang.errorslimit }}</label>
<input type="number" ng-model="storageErrors" value="{{ storageErrors }}" min="10">
</div>
<div class="field">
<label>{{ lang.opacity }}</label>
<input type="number" ng-model="storageOpacity" value="{{ storageOpacity }}" min="25" step="5">
</div>
<div class="field">
<label>{{ lang.refreshTime }}</label>
<input type="number" ng-model="refreshTime" value="{{ refreshTime }}" min="10" step="1">
</div>
<button class="button expanded neutral">{{ lang.save }}</button>
</form>

Answer 1

Problem was that I use value="{{ storageOpacity }}" and I just need to use ng-model. Beside this I need to use parseInt for some integer values...

Answer 2

localStorage can only handle strings so setting integers is going to cause issues.
Use a library like localForage which has the same API but will use IndexedDb in Electron and handles other data types.