Merge pull request #1262 from samccone/sjs/fix-angular-leaks

Fix angular directive bugs

examples/angular-dart/readme.md

@@ -49,7 +49,7 @@ dedicated version of Chromium with an embedded Dart VM.
 ## Compiling
 
 ```
-dart2js src/main.dart -o dist/main.js
+dart2js web/main.dart -o web/main.js
 ```
 
 The dart2js compilator can be found in the SDK.

examples/angularjs-perf/js/directives/todoEscape.js

@@ -13,5 +13,9 @@ todomvc.directive('todoEscape', function () {
 				scope.$apply(attrs.todoEscape);
 			}
 		});
+
+		scope.$on('$destroy', function () {
+			elem.unbind('keydown');
+		});
 	};
 });

examples/angularjs/js/directives/todoEscape.js

@@ -16,5 +16,9 @@ angular.module('todomvc')
 					scope.$apply(attrs.todoEscape);
 				}
 			});
+
+			scope.$on('$destroy', function () {
+				elem.unbind('keydown');
+			});
 		};
 	});

examples/angularjs_require/js/directives/todoEscape.js

@@ -11,6 +11,10 @@ define(['app'], function (app) {
 					scope.$apply(attrs.todoEscape);
 				}
 			});
+
+			scope.$on('$destroy', function () {
+				elem.unbind('keydown');
+			});
 		};
 	});
 });

examples/firebase-angular/js/directives/todoBlur.js

@@ -9,5 +9,9 @@ todomvc.directive('todoBlur', function () {
 		elem.bind('blur', function () {
 			scope.$apply(attrs.todoBlur);
 		});
+
+		scope.$on('$destroy', function () {
+			elem.unbind('blur');
+		});
 	};
 });

examples/firebase-angular/js/directives/todoEscape.js

@@ -13,5 +13,9 @@ todomvc.directive('todoBlur', function () {
 				scope.$apply(attrs.todoEscape);
 			}
 		});
+
+		scope.$on('$destroy', function () {
+			elem.unbind('keydown');
+		});
 	};
 });

examples/typescript-angular/js/Application.js

@@ -44,9 +44,8 @@ var todos;
     function todoBlur() {
         return {
             link: function ($scope, element, attributes) {
-                element.bind('blur', function () {
-                    $scope.$apply(attributes.todoBlur);
-                });
+                element.bind('blur', function () { $scope.$apply(attributes.todoBlur); });
+                $scope.$on('$destroy', function () { element.unbind('blur'); });
             }
         };
     }
@@ -54,7 +53,7 @@ var todos;
 })(todos || (todos = {}));
 /// <reference path='../_all.ts' />
 var todos;
-(function (_todos) {
+(function (todos_1) {
     'use strict';
     /**
      * Services that persists and retrieves TODOs from localStorage.
@@ -71,7 +70,7 @@ var todos;
         };
         return TodoStorage;
     })();
-    _todos.TodoStorage = TodoStorage;
+    todos_1.TodoStorage = TodoStorage;
 })(todos || (todos = {}));
 /// <reference path='../_all.ts' />
 var todos;
@@ -106,7 +105,9 @@ var todos;
             $scope.location = $location;
         }
         TodoCtrl.prototype.onPath = function (path) {
-            this.$scope.statusFilter = (path === '/active') ? { completed: false } : (path === '/completed') ? { completed: true } : null;
+            this.$scope.statusFilter = (path === '/active') ?
+                { completed: false } : (path === '/completed') ?
+                { completed: true } : null;
         };
         TodoCtrl.prototype.onTodos = function () {
             this.$scope.remainingCount = this.filterFilter(this.todos, { completed: false }).length;
@@ -139,9 +140,7 @@ var todos;
             this.$scope.todos = this.todos = this.todos.filter(function (todoItem) { return !todoItem.completed; });
         };
         TodoCtrl.prototype.markAll = function (completed) {
-            this.todos.forEach(function (todoItem) {
-                todoItem.completed = completed;
-            });
+            this.todos.forEach(function (todoItem) { todoItem.completed = completed; });
         };
         // $inject annotation.
         // It provides $injector with information about dependencies to be injected into constructor
@@ -166,6 +165,20 @@ var todos;
 var todos;
 (function (todos) {
     'use strict';
-    var todomvc = angular.module('todomvc', []).controller('todoCtrl', todos.TodoCtrl).directive('todoBlur', todos.todoBlur).directive('todoFocus', todos.todoFocus).service('todoStorage', todos.TodoStorage);
+    var todomvc = angular.module('todomvc', [])
+        .controller('todoCtrl', todos.TodoCtrl)
+        .directive('todoBlur', todos.todoBlur)
+        .directive('todoFocus', todos.todoFocus)
+        .service('todoStorage', todos.TodoStorage);
 })(todos || (todos = {}));
+/// <reference path='libs/jquery/jquery.d.ts' />
+/// <reference path='libs/angular/angular.d.ts' />
+/// <reference path='models/TodoItem.ts' />
+/// <reference path='interfaces/ITodoScope.ts' />
+/// <reference path='interfaces/ITodoStorage.ts' />
+/// <reference path='directives/TodoFocus.ts' />
+/// <reference path='directives/TodoBlur.ts' />
+/// <reference path='services/TodoStorage.ts' />
+/// <reference path='controllers/TodoCtrl.ts' />
+/// <reference path='Application.ts' />
 //# sourceMappingURL=Application.js.map
\ No newline at end of file

examples/typescript-angular/js/directives/TodoBlur.ts

@@ -10,7 +10,8 @@ module todos {
         return {
             link: ($scope: ng.IScope, element: JQuery, attributes: any) => {
                 element.bind('blur', () => { $scope.$apply(attributes.todoBlur); });
+                $scope.$on('$destroy', () => { element.unbind('blur'); });
             }
         };
     }
-}
\ No newline at end of file
+}

examples/typescript-angular/package.json

 {
   "private": true,
+  "scripts": {
+    "compile": "tsc --sourcemap --out js/Application.js js/_all.ts"
+  },
   "dependencies": {
     "angular": "^1.3.13",
     "todomvc-app-css": "^1.0.0",
     "todomvc-common": "^1.0.1"
+  },
+  "devDependencies": {
+    "typescript": "^1.5.0-alpha"
   }
 }

examples/typescript-angular/readme.md

@@ -75,11 +75,11 @@ It's definitely possible to convert the vanillajs todo app into TypeScript, but
 
 A standalone TypeScript compiler is available on NPM.
 
-	npm install -g typescript
+	npm install
 
 To compile the TypeScript in this project:
 
 	# from labs/architecture-examples/typescript-angular
-	tsc --sourcemap --out js/Application.js js/_all.ts
+	run `npm run compile`
 
 Or use Visual Studio with the TypeScript plugin.