Ionic + cordova-sqlite-storage + deviceready =转换时无渲染？

Question

自从将cordova-sqlite-storage插件和重构控制器添加到类似下面的代码中以来，我发现标签之间的转换出现了奇怪的行为。

angular.module('blah.controllers').controller('EquipmentCtrl', ['$scope', '$state', 'EquipmentService', 'UtilService', function($scope, $state, EquipmentService, UtilService) {

    document.addEventListener("deviceready", getRowsFromDb, false);

    function getRowsFromDb() {
        EquipmentService.getAllEquipment().then(function(rows) {

            $scope.equipmentList = rows;
            $scope.equipmentRows = UtilService.chunkArray($scope.equipmentList, 3);
        });
    }    
}]);

在最初的页面加载中，一切工作/看起来都很棒，但是当我在标签之间切换时，我看不到来自sqlite的数据，直到我第二次点击相同的标签。

页面将加载到显示静态数据(标题、其他文本等)，但在第二次点击当前选项卡之前，我不会看到从sqlite返回的数据。我想知道'deviceready‘是否会在页面加载后触发，但我不确定如何解决这个问题。

我尝试过this solution，但看不到任何行为上的差异。

其他人也遇到过这种情况吗?如果有，最好的攻击计划是什么？

Answer 1

由于deviceready在angularjs的上下文之外运行，因此您必须手动应用消化。在这种情况下，您可以使用$scope.$apply从apply回调中应用作用域更改：

$scope.$apply(function () {
    // do scope things here
});

下面的示例取自您的示例，并使用此技术进行了更新。

​

angular.module('blah.controllers', [])
  .controller('EquipmentCtrl', [
    '$scope',
    '$state',
    'EquipmentService',
    'UtilService',
    EquipmentCtrl
  ]);

function EquipmentCtrl($scope, $state, EquipmentService, UtilService) {

  document.addEventListener("deviceready", getRowsFromDb, false);

  function getRowsFromDb() {
    EquipmentService.getAllEquipment().then(function(rows) {
      $scope.$apply(function() {
        $scope.equipmentList = rows;
        $scope.equipmentRows = UtilService.chunkArray($scope.equipmentList, 3);
      });
    });
  }
}

​