Use new scope for directive. Allows multiple spinners on page.

xtiancapil · Aug 12, 2013 · 6f1b20e · 6f1b20e
1 parent 0f2af72
commit 6f1b20e
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 1 deletion.
diff --git a/angular-spinner.js b/angular-spinner.js
@@ -7,6 +7,7 @@
 angular.module('angularSpinner', [])
 	.directive('usSpinner', function ($window) {
 		return {
+			scope: true,
 			link: function (scope, element, attr) {
 				scope.spinner = null;
 				scope.$watch(attr.usSpinner, function (options) {

diff --git a/angular-spinner.min.js b/angular-spinner.min.js
diff --git a/tests.js b/tests.js
@@ -37,6 +37,16 @@ describe('Directive: us-spinner', function () {
 		expect(Spinner.prototype.stop).not.toHaveBeenCalled();
 	}));
 
+	it('should start spinning the second spinner without stopping the first one', inject(function ($rootScope, $compile) {
+		var element = angular.element('<div us-spinner></div>');
+		element = $compile(element)($rootScope);
+		var secondElement = angular.element('<div us-spinner></div>');
+		secondElement = $compile(element)($rootScope);
+		$rootScope.$digest();
+		expect(Spinner.prototype.spin.callCount).toBe(2);
+		expect(Spinner.prototype.stop).not.toHaveBeenCalled();
+	}));
+
 	it('should set spinner options as given in attribute', inject(function ($rootScope, $compile) {
 		var element = angular.element('<div us-spinner="{width:15}"></div>');
 		element = $compile(element)($rootScope);