Ionic Увеличить Размер шрифта

Question

Я видел его в нескольких приложениях, но, похоже, не понял его. Я просто хочу поместить значок для шрифта (с + и -), когда пользователь нажимает на него, он увеличит размер шрифта или уменьшит его.

Answer 1

Working plunker.

controllers.js

angular.module('starter.controllers', []) 

.controller('DashCtrl', function($scope) { 
    $scope.size = 14; 
    $scope.fontSize = "font-size-" + $scope.size; 

    $scope.increase = function(){ 
     //Higher limit 
     if($scope.size < 18){ 
      $scope.size++; 
      $scope.fontSize = "font-size-" + $scope.size; 
     } 
    }; 

    $scope.decrease = function(){ 
     //Lower limit 
     if($scope.size > 14){ 
      $scope.size--; 
      $scope.fontSize = "font-size-" + $scope.size; 
     } 
    }; 
}); 

закладками dash.html

<ion-view view-title="Dashboard"> 
    <ion-content class="padding" ng-class="fontSize"> 
    <button class="button" ng-click="increase()"><i class="ion-plus-round"></i></button> 
    <button class="button" ng-click="decrease()"><i class="ion-minus-round"></i></button> 
    <div class="list card"> 
     <div class="item item-divider">Recent Updates</div> 
     <div class="item item-body"> 
     <div> 
      There is a fire in <b>sector 3</b> 
     </div> 
     </div> 
    </div> 
    <div class="list card"> 
     <div class="item item-divider">Health</div> 
     <div class="item item-body"> 
     <div> 
      You ate an apple today! 
     </div> 
     </div> 
    </div> 
    <div class="list card"> 
     <div class="item item-divider">Upcoming</div> 
     <div class="item item-body"> 
     <div> 
      You have <b>29</b> meetings on your calendar tomorrow. 
     </div> 
     </div> 
    </div> 
    </ion-content> 
</ion-view> 

style.css

.font-size-14 *{ 
    font-size: 14px; 
} 

.font-size-15 *{ 
    font-size: 15px; 
} 

.font-size-16 *{ 
    font-size: 16px; 
} 

.font-size-17 *{ 
    font-size: 17px; 
} 

.font-size-18 *{ 
    font-size: 18px; 
} 

добавить нижний и верхний пределы, так что пользователь не может пройти через эти два font-size.