【问题标题】:Saving and retrieving checkbox value from local storage in angularjs从angularjs中的本地存储中保存和检索复选框值
【发布时间】:2016-11-15 00:08:32
【问题描述】:

我有一些问题,在我的 Ionic 应用程序中使用切换开关来打开/关闭功能。默认情况下toggle为true,当toggle更改时切换为false。

<ion-toggle ng-model="myToggle.checked" ng-change="myToggleChange()">
  Toggle
</ion-toggle> 

使用应用程序时一切正常,但是如果我关闭应用程序并且在我再次加载应用程序时关闭之前开关为假,则当我的控制器启动时,默认情况下切换为真。重新加载应用程序后缓存切换如何在关闭前有位置? 控制器:

      $scope.myToggleChange = function() {

        if($scope.myToggle.checked == true){
            console.log('Is True', $scope.myToggle.checked);
        }
        if($scope.myToggle.checked == false){
            console.log('Is False', $scope.myToggle.checked);
        }
      };

      $scope.myToggle = { checked: true };

【问题讨论】:

    标签: angularjs checkbox ionic-framework local-storage ion-toggle


    【解决方案1】:

    您可以使用本地存储来存储此类数据。 https://github.com/gsklee/ngStorage

    在您的更改处理程序中,您可以使用存储值

     $localStorage.myToogleValue = $scope.myToggle
    

    你的控制器可以在开始时检查

    if ($localStorage.myToogleValue)
        $scope.myToggle = { checked: $localStorage.myToogleValue.checked };
    else
        $scope.myToggle = { checked: true };
    

    【讨论】:

      【解决方案2】:

      通过阅读文档和手册 10 小时解决 )))

        $scope.myToggleItem = localStorage.getItem('check');
      
          if($scope.myToggleItem){    
            var item = localStorage.getItem('check');  
            $scope.myToggle = {checked: JSON.parse(item)};
      
          } else {    
            $scope.myToggle = { checked: true };
          }
      
        $scope.myToggleChange = function() {
      
          if($scope.myToggle.checked == true){
              console.log('Item', $scope.myToggle.checked);
              localStorage.setItem('check', $scope.myToggle.checked);
          }
          if($scope.myToggle.checked == false){
              console.log('Item', $scope.myToggle.checked);
              localStorage.setItem('check', $scope.myToggle.checked);
          }
        };
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2015-06-20
        • 2012-05-01
        • 1970-01-01
        • 2016-08-22
        • 2014-03-31
        • 2015-02-14
        • 2013-05-13
        • 1970-01-01
        相关资源
        最近更新 更多