Angular Typealong

Eh, quick fun with data binding and $timeout

by Steven Senkus

HTML

<div ng-app="watchApp">
    <div ng-controller="watchController">
        <input ng-model="inputVal" />
         <h1>{{text}}</h1>
        <pre>{{ms}} ms reponse</pre>

    </div>
</div>

JavaScript

var app = angular.module('watchApp', []);
app.controller('watchController', ['$scope', '$timeout', function ($scope, $timeout) {
    $scope.ms = 400;
    $scope.text = null;
    $scope.$watch('inputVal', function (val) {
        var anim;
        
        if (!(val === undefined || val === null)) {
            anim = $timeout(function () {
                $scope.text = val;
                $scope.ms += 100;
            }, $scope.ms);

        }
    });
}]);