如何记录复选框是否被选中？

Question

我正在使用 Ionic 在移动应用程序中处理体育列表，有一个视图供用户选择（检查）列表中希望看到的体育项目

<input type="checkbox"
       ng-model="sport.checked"
       ng-init="sport.checked=true">

然后一旦他选择了运动，他就转到另一个视图

<div ng-repeat="sport in sports">
    <div ng-show="sport.checked">

      {{sport.name}}

    </div>
</div>

但如果用户刷新页面或转到任何其他视图并尝试返回到运动视图，他将失去他刚刚选择的运动，因此他需要重新执行选择运动的动作他想看

I recorded this video for you to understand easier

在视频中，您会看到我转到视图并取消选中列表中的前两项运动，它们消失了，但一旦我刷新页面，这两项运动就会再次出现在列表中。

也许问题出在 ng-init 所以我想让你们告诉我伙计们我需要做什么来记录他选择的运动项目？

更新

根据你的回答，看看我的控制器：

angular.module('myApp')
  .controller('SportsController', function($scope, $state, $ionicModal, $ionicLoading,
                                           $timeout, AuthFactory, SportsFactory) {
    $scope.sports = [];
    $scope.customer = {};

    AuthFactory.getCustomer().then(function(customer) {
      $scope.customer = customer;
      SportsFactory.getSportsWithLeagues(customer).then(function(sports) {
        $ionicLoading.hide();
        if (sports.length) {
          $scope.sports = sports;
        }else {
          AuthFactory.logout();
        }

      }, function(err) {
        $ionicLoading.hide();
        console.log(err);
      });
    }, function(err) {
      $ionicLoading.hide();
      $state.go('app.login');
      console.log(err);
    });

    $scope.isSportShown = function(sport) {
      return $scope.shownSport === sport;
    };

    $scope.goToLines = function(league) {
      var linesParameters = {
        customerId: $scope.customer.customer,
        top: 10,
        familyGameId: -1,
        games: -1,
        sports: league.sport.id,
        leagues: league.id,
        periods: league.lineType,
        part: league.part
      };
      $state.transitionTo('app.lines', linesParameters);
    };
  });

Answer 1

当页面 closed/refreshed 时，浏览器中发生的一切都将丢失，除非它被保存到数据库中，或者对于像这种简单的情况，您可以使用本地存储。

要了解这个想法，您可以这样做：

<input type="checkbox"
   ng-model="sport.checked"
   ng-change="save(sport.checked)"
   ng-init="sport.checked = CONFIG.sport">

在控制器中：

$scope.CONFIG = localStorage.getItem('CONFIG');
if (!$scope.CONFIG) {
  $scope.CONFIG = {sport: true};
}

$scope.save = function(checked) {
  $scope.CONGIF.sport = checked;
  localStorage.setItem('CONFIG', $scope.CONFIG);
}

基本上当用户检查时，您将其存储到 localStorage 中（这里使用 CONFIG 变量，但它可以是任何东西）。然后在页面初始化时，读取 localStorage 的值。

localStorage 只是浏览器本身的临时存储：如果用户切换浏览器或使用另一台计算机，他将看不到他的持久数据。如果你想这样做，它需要通过一些数据库在服务器端持久化。

如何记录复选框是否被选中？

How to keep the record whether a checkbox has been checked or not?

angularjs

ionic-framework