2016-07-27 22 views
0

次回にページを開くときに、チェックボックスの現在の状態を保存してリロードします。AngularJSを使用してチェックボックスの状態をローカルストレージに保存する方法は?

AngularJS:

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

app.controller('MyController', function ($scope, $window) { 

    var init = function() { 
     $scope.check = $window.localStorage.getItem("app3"); 
    }; 

    init(); 

    $scope.Save = function() { 
     $window.localStorage.setItem("app3", $scope.check); 
    } 

}); 

HTML:

<html ng-app="MyApp" xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <script src="angular-1.4.9.min.js"></script> 
    <script src="app.js"></script> 
</head> 
<body> 
    <div ng-controller="MyController"> 
     <input id="check1" type="checkbox" ng-model="check" /> 
     <input type="button" value="Save" ng-click="Save()" /> 
    </div> 
</body> 
</html> 

答えて

0

いけない角度でjqueryのを使用します。 入力ボックスにng-modelを接続します。$ scope.checkを使用してコントローラの入力値にアクセスできます ローカルストレージの設定は次のようになります: $ window.localStorage.setItem( 'app3 '、$ scope.check); それはそうです!角の動作の仕方を理解するために、角チュートリアルまたはそのドキュメントを参照してください。

+0

あなたはこれを削除する必要がありますか:ng-checked = "SetCheckbox()"? – tesicg

+0

はいそれを削除し、ng-model = "check"を入れてください。 ng-modelを入力要素に付ける場合。どんな値を入力しても、$ scope.checkのようなコントローラーに変数が作成されます。 –

+0

チェックを入れたときに$ scope.checkがtrueになっていますが、$ scope.checkが未定義の場合は注意が必要です。未定義をローカルストレージに保存するのは定期的ですか? – tesicg

関連する問題