var myApp = angular.module('myApp',['Chronicle']);
myApp.controller('MyCtrl', function($scope, Chronicle) {
//Initializtion of variables
$scope.num = 1;
$scope.canUndo = false;
$scope.canRedo = false;
//Creation of chronicle object
$scope.numChronicle = Chronicle.record('num', $scope);
$scope.canUndoRedo = function(){
$scope.canUndo = $scope.numChronicle.canUndo();
$scope.canRedo = $scope.numChronicle.canRedo();
};
$scope.numChronicle.addOnAdjustFunction($scope.canUndoRedo);
$scope.numChronicle.addOnUndoFunction($scope.canUndoRedo);
$scope.numChronicle.addOnRedoFunction($scope.canUndoRedo);
//Functions used by buttons
$scope.increment1 = function(){
$scope.num++;
};
$scope.increment5 = function(){
$scope.num+= 5;
};
$scope.undo = function(){
$scope.numChronicle.undo()
};
$scope.redo = function(){
$scope.numChronicle.redo()
};
});
<div ng-controller="MyCtrl">
{{num}}
<button ng-click="increment1()">Increment by 1</button>
<button ng-click="increment5()">Increment by 5</button>
<br>
<button ng-click="undo()" ng-if="canUndo">Undo</button>
<button ng-click="redo()" ng-if="canRedo">Redo</button>
</div>
External resources loaded into this fiddle: