在Angular Js中重新加載后，如何將javascript控制器中的復選框（選中或未選中）更新為html頁面？

Question

我是angular js的新手，正在實現單頁應用程序。 我已經實現了一個復選框，當我選中該復選框時，我想在重新加載后保持該復選框的狀態。 所以當我單擊復選框然后通過Angular js中的$ on（$ destroy）在會話中存儲狀態（選中或未選中）。

我已經看到一個鏈接， 在頁面刷新AngularJS之后 ， 請保持選中復選框 ，但這在我的情況下不起作用。

我正在分享我的示例代碼。

的HTML

 <input type="checkbox" id="mycheckbox" class="checkbox style-0" name="mycheckbox" ng-model="mycheckbox" data-ng-change="confirm()" autocomplete="off"/>

控制器：

$scope.confirm = function(){
  if($scope.mycheckbox== false)
  {
    sessionStorage.setItem("confirmCheck", $scope.mycheckbox);        
  }
  if($scope.mycheckbox== true){
    sessionStorage.setItem("confirmCheck", $scope.mycheckbox);       
  }
}
if(sessionStorage.confirmCheck == "true"){      
   $('#mycheckbox').prop('checked',true);
}else {
   $('#mycheckbox').prop('checked',false);
}

$scope.$on('$destroy',function(){
  sessionStorage.confirmCheck=sessionStorage.getItem('confirmCheck');
     })

我可以在會話中存儲復選框的狀態，但是我無法在HTML頁面中更改狀態。當我導航到另一頁面並返回上一頁時，值將保留在角度控制器中，但不會在HTML頁面中更新。 請分享您的想法。 提前致謝。

Answer 1

我真的建議您避免將Angular與jQuery混合使用，相反，您將更喜歡使用angular完成工作。

1）將會話存儲檢查值保存在可從角度模板訪問的位置。

$scope.isChecked = sessionStorage.getItem('confirmCheck');

2）使用角度指令ngChecked。

<input type="checkbox" ng-checked="isChecked"></input>