angular.module("myApp", [])
.controller("BadController", function($scope){
  // This variable starts as a scalar value. Danger! Danger!
  $scope.myModel = null;
  $scope.models = ["red", "white", "blue"];
})
.controller("GoodController", function($scope){
  // This object will be accessible in all isolate scope underneath this scope.
  $scope.uiState = {};
  // This variable is inside a non-scalar variable. All is good.
  $scope.uiState.myModel = null;
  $scope.uiState.models = ["red", "white", "blue"];
});

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

app.controller('MainCtrl', function($scope) {
  $scope.checkUsername = function() {
    //send ajax to check on server
    if ($scope.username === 'hellobug') {
      $scope.usernameAlreadyExist = true;
    }
  };
});

app.directive('ngBlur', function($document) {
  return {
    link: function(scope, element, attrs) {
      $(element).bind('blur', function(e){
         scope.$apply(attrs.ngBlur);
      });
    }
  };
});

app.directive('repeater', function($document) {
  return {
    restrict: 'A',
    compile: function(element, attrs) {
      var template = $(element).children().clone();
      for(var i=0; i<attrs.repeater - 1; i++) {
        $(element).append(template.clone());
      }
    }
  };
});