JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap-combined.min.css">
<div ng-app="blur" ng-controller="blur">
     <h3>Input disabled while saving</h3>

    <p class="muted">Type one character, and the input field loses focus.</p>
    <div ng-repeat="person in people">{{person.name}}
        <br/>
        <input type="number" ng-model="person.age" ng-change="person.save()" ng-disabled="person.saving" />{{person.age}}
        <br/>
    </div>
    <div>{{saved}}</div>
</div>

JavaScript

angular.module('blur', [])
    .controller('blur', function ($scope, $timeout) {
    function Person(data) {
        angular.extend(this, data);
    }
    Person.prototype = {
        constructor: Person,
        save: function () {
            $scope.saved = angular.extend({}, this);
            this.saving = true;
            // simulate asynchronous save
            $timeout(angular.bind(this, function () {
                this.saving = false;
            }), 10);
        }
    };

    $scope.people = [{
        name: 'Sam',
        age: 3
    }, {
        name: 'Harry',
        age: 12
    }, {
        name: 'Sally',
        age: 53
    }].map(function (data) {
        return new Person(data);
    });
});