diff --git a/src/components/chips/demoBasicUsage/index.html b/src/components/chips/demoBasicUsage/index.html index 6c0c5b29840..60067926703 100644 --- a/src/components/chips/demoBasicUsage/index.html +++ b/src/components/chips/demoBasicUsage/index.html @@ -20,22 +20,23 @@

Use a custom chip template.


Use the default chip template.

- + +
-

Use ng-change

+

Use ng-change and add-on-blur

- +

Make chips editable.

- +
-

Use Placeholders and override hint texts.

md-chips component. In order to achieve this, the behavior has changed to also select and highlight the newly appended chip for 300ms before re-focusing the text input.

-

Please see the documentation for more information and for the new md-chip-append-delay option which allows you to customize this delay. -

\ No newline at end of file +

diff --git a/src/components/chips/demoBasicUsage/script.js b/src/components/chips/demoBasicUsage/script.js index 7f615e520a6..7ad42cbb78d 100644 --- a/src/components/chips/demoBasicUsage/script.js +++ b/src/components/chips/demoBasicUsage/script.js @@ -7,7 +7,7 @@ }]) .controller('BasicDemoCtrl', DemoCtrl); - function DemoCtrl ($timeout, $q) { + function DemoCtrl ($timeout, $q, $log) { var self = this; self.readonly = false; @@ -42,7 +42,7 @@ }; self.onModelChange = function(newModel) { - alert('The model has changed'); + $log.log('The model has changed to ' + newModel + '.'); }; } })(); diff --git a/src/components/chips/js/chipsController.js b/src/components/chips/js/chipsController.js index 2d8b8125148..85716cbbb45 100644 --- a/src/components/chips/js/chipsController.js +++ b/src/components/chips/js/chipsController.js @@ -446,8 +446,7 @@ MdChipsCtrl.prototype.resetSelectedChip = function() { * determined as the next chip in the list, unless the target chip is the * last in the list, then it is the chip immediately preceding the target. If * there is only one item in the list, -1 is returned (select none). - * The number returned is the index to select AFTER the target has been - * removed. + * The number returned is the index to select AFTER the target has been removed. * If the current chip is not selected, then -1 is returned to select none. * @param {number} index * @returns {number} @@ -464,7 +463,7 @@ MdChipsCtrl.prototype.getAdjacentChipIndex = function(index) { * @param {string} newChip chip buffer contents that will be used to create the new chip */ MdChipsCtrl.prototype.appendChip = function(newChip) { - this.shouldFocusLastChip = true; + this.shouldFocusLastChip = !this.addOnBlur; if (this.useTransformChip && this.transformChip) { var transformedChip = this.transformChip({'$chip': newChip}); @@ -733,7 +732,9 @@ MdChipsCtrl.prototype.selectAndFocusChip = function(index) { * @param {number} index location of chip to focus */ MdChipsCtrl.prototype.focusChip = function(index) { - var chipContent = this.$element[0].querySelector('md-chip[index="' + index + '"] .md-chip-content'); + var chipContent = this.$element[0].querySelector( + 'md-chip[index="' + index + '"] .md-chip-content' + ); this.ariaTabIndex = index; @@ -888,14 +889,16 @@ MdChipsCtrl.prototype.shouldAddOnBlur = function() { // If the model value is empty and required is set on the element, then the model will be invalid. // In that case, we still want to allow adding the chip. The main (but not only) case we want // to disallow is adding a chip on blur when md-max-chips validation fails. - var isModelValid = this.ngModelCtrl.$isEmpty(this.ngModelCtrl.$modelValue) || this.ngModelCtrl.$valid; + var isModelValid = this.ngModelCtrl.$isEmpty(this.ngModelCtrl.$modelValue) || + this.ngModelCtrl.$valid; var isAutocompleteShowing = this.autocompleteCtrl && !this.autocompleteCtrl.hidden; if (this.userInputNgModelCtrl) { isModelValid = isModelValid && this.userInputNgModelCtrl.$valid; } - return this.addOnBlur && !this.requireMatch && chipBuffer && isModelValid && !isAutocompleteShowing; + return this.addOnBlur && !this.requireMatch && chipBuffer && isModelValid && + !isAutocompleteShowing; }; /**