On color select callback

README.md

@@ -107,6 +107,7 @@ $scope.scopeVariable.options = {
 | rgb             	| md-color-rgb          	| Boolean     	| true               	| Show the RGB values tab.                                                                                                                                                                                                                                	|
 | hsl             	| md-color-hsl          	| Boolean     	| true               	| Show the HSL values tab.                                                                                                                                                                                                                                	|
 | defaultTab          	| md-color-default-tab      	| String, Int 	| "spectrum"         	| Which tab should be selected when opening.  Can either be a string or index.  If the value is an index, do not count hidden/disabled tabs. <ul><li>spectrum</li><li>sliders</li><li>genericPalette</li><li>materialPalette</li><li>history</li></ul> 	|
+| onSelect          	| md-color-on-select      	| Function 	| function() {}         	| Callback which is called when color is selected. Please note: it works only via attribute now 	|
 
 
 ## Disclaimer

demo/js/app.js

@@ -32,5 +32,7 @@ app.controller('MainCtrl', function($scope) {
         defaultTab: 1,
     };
     $scope.textConfig.showPreview = true;
-
+	$scope.onColorSelect = function (color) {
+		console.log(color)
+	};
 });

index.html

@@ -79,6 +79,7 @@ <h4>Text Style</h4>
                         ng-model="textConfig.textBackground"
                         md-color-history="true"
 						md-color-alpha-channel="true"
+                        md-color-on-select="onColorSelect(color)"
                     ></div>
         		</div>
 

src/js/mdColorPicker.js

@@ -461,7 +461,8 @@ angular.module('mdColorPicker', [])
 				mdColorHex: '=?',
 				mdColorRgb: '=?',
 				mdColorHsl: '=?',
-				mdColorDefaultTab: '=?'
+				mdColorDefaultTab: '=?',
+				mdColorOnSelect: '&?'
 			},
 			controller: ['$scope', '$element', '$attrs', '$mdDialog', '$mdColorPicker', function( $scope, $element, $attrs, $mdDialog, $mdColorPicker ) {
 				var didJustClose = false;
@@ -506,6 +507,7 @@ angular.module('mdColorPicker', [])
 				$scope.mdColorHex = $scope.mdColorHex === undefined ? true : $scope.mdColorHex;
 				$scope.mdColorRgb = $scope.mdColorRgb === undefined ? true : $scope.mdColorRgb;
 				$scope.mdColorHsl = $scope.mdColorHsl === undefined ? true : $scope.mdColorHsl;
+				$scope.mdColorOnSelect = $scope.mdColorOnSelect === undefined ? function() {} : $scope.mdColorOnSelect;
 				// Set the starting value
 				updateValue();
 
@@ -554,6 +556,7 @@ angular.module('mdColorPicker', [])
 						mdColorRgb: $scope.mdColorRgb,
 						mdColorHsl: $scope.mdColorHsl,
 						mdColorDefaultTab: $scope.mdColorDefaultTab,
+						mdColorOnSelect: $scope.mdColorOnSelect,
 
 						$event: $event,
 
@@ -938,6 +941,7 @@ angular.module('mdColorPicker', [])
 
 				dialog.then(function (value) {
                     colorHistory.add(new tinycolor(value));
+					options.mdColorOnSelect({color: value});
                 }, function () { });
 
                 return dialog;