Commit 7cb5234b authored by Arthur Verschaeve's avatar Arthur Verschaeve

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

Fix angular directive bugs
parents ae1c00ca d1dd7e35
...@@ -49,7 +49,7 @@ dedicated version of Chromium with an embedded Dart VM. ...@@ -49,7 +49,7 @@ dedicated version of Chromium with an embedded Dart VM.
## Compiling ## 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. The dart2js compilator can be found in the SDK.
......
...@@ -13,5 +13,9 @@ todomvc.directive('todoEscape', function () { ...@@ -13,5 +13,9 @@ todomvc.directive('todoEscape', function () {
scope.$apply(attrs.todoEscape); scope.$apply(attrs.todoEscape);
} }
}); });
scope.$on('$destroy', function () {
elem.unbind('keydown');
});
}; };
}); });
...@@ -16,5 +16,9 @@ angular.module('todomvc') ...@@ -16,5 +16,9 @@ angular.module('todomvc')
scope.$apply(attrs.todoEscape); scope.$apply(attrs.todoEscape);
} }
}); });
scope.$on('$destroy', function () {
elem.unbind('keydown');
});
}; };
}); });
...@@ -11,6 +11,10 @@ define(['app'], function (app) { ...@@ -11,6 +11,10 @@ define(['app'], function (app) {
scope.$apply(attrs.todoEscape); scope.$apply(attrs.todoEscape);
} }
}); });
scope.$on('$destroy', function () {
elem.unbind('keydown');
});
}; };
}); });
}); });
...@@ -9,5 +9,9 @@ todomvc.directive('todoBlur', function () { ...@@ -9,5 +9,9 @@ todomvc.directive('todoBlur', function () {
elem.bind('blur', function () { elem.bind('blur', function () {
scope.$apply(attrs.todoBlur); scope.$apply(attrs.todoBlur);
}); });
scope.$on('$destroy', function () {
elem.unbind('blur');
});
}; };
}); });
...@@ -13,5 +13,9 @@ todomvc.directive('todoBlur', function () { ...@@ -13,5 +13,9 @@ todomvc.directive('todoBlur', function () {
scope.$apply(attrs.todoEscape); scope.$apply(attrs.todoEscape);
} }
}); });
scope.$on('$destroy', function () {
elem.unbind('keydown');
});
}; };
}); });
...@@ -44,9 +44,8 @@ var todos; ...@@ -44,9 +44,8 @@ var todos;
function todoBlur() { function todoBlur() {
return { return {
link: function ($scope, element, attributes) { link: function ($scope, element, attributes) {
element.bind('blur', function () { element.bind('blur', function () { $scope.$apply(attributes.todoBlur); });
$scope.$apply(attributes.todoBlur); $scope.$on('$destroy', function () { element.unbind('blur'); });
});
} }
}; };
} }
...@@ -54,7 +53,7 @@ var todos; ...@@ -54,7 +53,7 @@ var todos;
})(todos || (todos = {})); })(todos || (todos = {}));
/// <reference path='../_all.ts' /> /// <reference path='../_all.ts' />
var todos; var todos;
(function (_todos) { (function (todos_1) {
'use strict'; 'use strict';
/** /**
* Services that persists and retrieves TODOs from localStorage. * Services that persists and retrieves TODOs from localStorage.
...@@ -71,7 +70,7 @@ var todos; ...@@ -71,7 +70,7 @@ var todos;
}; };
return TodoStorage; return TodoStorage;
})(); })();
_todos.TodoStorage = TodoStorage; todos_1.TodoStorage = TodoStorage;
})(todos || (todos = {})); })(todos || (todos = {}));
/// <reference path='../_all.ts' /> /// <reference path='../_all.ts' />
var todos; var todos;
...@@ -106,7 +105,9 @@ var todos; ...@@ -106,7 +105,9 @@ var todos;
$scope.location = $location; $scope.location = $location;
} }
TodoCtrl.prototype.onPath = function (path) { 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 () { TodoCtrl.prototype.onTodos = function () {
this.$scope.remainingCount = this.filterFilter(this.todos, { completed: false }).length; this.$scope.remainingCount = this.filterFilter(this.todos, { completed: false }).length;
...@@ -139,9 +140,7 @@ var todos; ...@@ -139,9 +140,7 @@ var todos;
this.$scope.todos = this.todos = this.todos.filter(function (todoItem) { return !todoItem.completed; }); this.$scope.todos = this.todos = this.todos.filter(function (todoItem) { return !todoItem.completed; });
}; };
TodoCtrl.prototype.markAll = function (completed) { TodoCtrl.prototype.markAll = function (completed) {
this.todos.forEach(function (todoItem) { this.todos.forEach(function (todoItem) { todoItem.completed = completed; });
todoItem.completed = completed;
});
}; };
// $inject annotation. // $inject annotation.
// It provides $injector with information about dependencies to be injected into constructor // It provides $injector with information about dependencies to be injected into constructor
...@@ -166,6 +165,20 @@ var todos; ...@@ -166,6 +165,20 @@ var todos;
var todos; var todos;
(function (todos) { (function (todos) {
'use strict'; '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 = {})); })(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 //# sourceMappingURL=Application.js.map
\ No newline at end of file
...@@ -10,6 +10,7 @@ module todos { ...@@ -10,6 +10,7 @@ module todos {
return { return {
link: ($scope: ng.IScope, element: JQuery, attributes: any) => { link: ($scope: ng.IScope, element: JQuery, attributes: any) => {
element.bind('blur', () => { $scope.$apply(attributes.todoBlur); }); element.bind('blur', () => { $scope.$apply(attributes.todoBlur); });
$scope.$on('$destroy', () => { element.unbind('blur'); });
} }
}; };
} }
......
{ {
"private": true, "private": true,
"scripts": {
"compile": "tsc --sourcemap --out js/Application.js js/_all.ts"
},
"dependencies": { "dependencies": {
"angular": "^1.3.13", "angular": "^1.3.13",
"todomvc-app-css": "^1.0.0", "todomvc-app-css": "^1.0.0",
"todomvc-common": "^1.0.1" "todomvc-common": "^1.0.1"
},
"devDependencies": {
"typescript": "^1.5.0-alpha"
} }
} }
...@@ -75,11 +75,11 @@ It's definitely possible to convert the vanillajs todo app into TypeScript, but ...@@ -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. A standalone TypeScript compiler is available on NPM.
npm install -g typescript npm install
To compile the TypeScript in this project: To compile the TypeScript in this project:
# from labs/architecture-examples/typescript-angular # 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. Or use Visual Studio with the TypeScript plugin.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment