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 ng-model='model.data'></textarea>
    </div>
</div>

JavaScript

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

app.filter('JSON.stringify', function () {
    return function (input) {
        return input;
    }
});


function Ctrl($scope) {
    $scope.model = {};
    $scope.model.data = {
        "kind": "title",
            "label": "ADD_TITLE",
            "iconSrc": "textTitle.png",
            "experimentInclude": "",
            "experimentExclude": "three",
            "preset": {
            "compType": "richTitle",
                "styleId": "txtNew"
        }


    };

    $scope.model.data.toString = stringify;

    function stringify() {
        return JSON.stringify(this);
    }

    $scope.$watch('model.data', function (v) {
        console.log(v);
        if (typeof v === 'string') {
            $scope.model.data = JSON.parse(v);
            $scope.model.data.toString = stringify;
        }
    })

}