Auto save with Angular

A service + directive that enables autosave on lost focus

HTML

<script src="http://code.angularjs.org/1.1.0/angular.min.js"></script>
<div ng-app="app" class="container">
    <div ng-controller="Ctrl" class="row">
        <textarea json-text ng-model='model.data'></textarea>        
    </div>    
</div>

JavaScript

var app = angular.module('app', []);

app.directive('jsonText', function() {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function(scope, element, attr, ngModel) {            
          function into(input) {
            console.log(JSON.parse(input));
            return JSON.parse(input);
          }
          function out(data) {
            return JSON.stringify(data);
          }
          ngModel.$parsers.push(into);
          ngModel.$formatters.push(out);
        }
    };
});
    
    
app.controller('Ctrl', ['$scope', function($scope) {
    $scope.model = {};
    $scope.model.data = {
        "kind": "title",
        "label": "ADD_TITLE",
        "iconSrc": "textTitle.png",
        "experimentInclude": "",
        "experimentExclude": "three",
        "preset": {
            "compType": "richTitle",
            "styleId": "txtNew"
        }
    };
}]);