3

我正在尝试在 Steroids+Angular1.3.15 (AppGyver) 混合应用程序中实现字体缩放。我决定使用$localStorage来存储当前字体大小。这一切都适用于 android 设备，但不适用于 iOS。实际上，在 iOS 中，它适用于新打开WebViews的设备，但不适用于已显示的设备。

字体缩放链接：

<a class="font-size font-small" data-remote="true" ng-class="{current: fontSize == 'rem-base-small'}" ng-click="setFontSize('rem-base-small')">A</a>
<a class="font-size font-medium" data-remote="true" ng-class="{current: fontSize == 'rem-base-medium'}" ng-click="setFontSize('rem-base-medium')">A</a>
<a class="font-size font-large" data-remote="true" ng-class="{current: fontSize == 'rem-base-large'}" ng-click="setFontSize('rem-base-large')">A</a>

在我的控制器中：

$scope.fontSize = $localStorage.fontSize || 'rem-base-medium'

$scope.setFontSize = function(size) {
  $localStorage.fontSize = size
  $scope.fontSize = size
}

我myfontsize在标签上使用指令<html>来更新 UI。我的指令如下所示：

var sharedStuff = angular.module('sharedStuff', ['ngStorage'])

  sharedStuff.directive('myfontsize', function($localStorage) {
    function link(scope, element, attrs) {
        var format,
            timeoutId;

        function updateClass() {
          element.removeClass('rem-base-large')
          element.removeClass('rem-base-medium')
          element.removeClass('rem-base-small')

          $localStorage.fontSize = $localStorage.fontSize || "rem-base-medium"
          element.addClass($localStorage.fontSize)
        }

        scope.$watch(attrs.myCurrentTime, function(value) {
          format = value;
          updateClass();
        });

        element.on('$destroy', function() {
          clearInterval(timeoutId);
        });

        // start the UI update process; save the timeoutId for canceling
        timeoutId = setInterval(function() {
          updateClass(); // update DOM
        }, 1000);
      }

      return {
        link: link
      };
  })

如果有人能解释为什么它可以在 android 上运行但在 iOS 上不行，我将非常感激。或者，如果您有更好的解决方案来实现我的目标并且不介意分享，请这样做:)

4

0 回答 0