diff --git a/src/components/select/demoBasicUsage/index.html b/src/components/select/demoBasicUsage/index.html
index 3beee57c17..165e0b2bb2 100755
--- a/src/components/select/demoBasicUsage/index.html
+++ b/src/components/select/demoBasicUsage/index.html
@@ -60,7 +60,7 @@
What armor do you wear?
-
+
Cloth
Leather
Chainmail
diff --git a/src/components/select/select.js b/src/components/select/select.js
index f79e599636..a10e820055 100755
--- a/src/components/select/select.js
+++ b/src/components/select/select.js
@@ -74,7 +74,8 @@ angular.module('material.components.select', [
* @param {expression=} md-selected-text Expression to be evaluated that will return a string
* to be displayed as a placeholder in the select input box when it is closed.
* @param {string=} placeholder Placeholder hint text.
- * @param md-no-asterisk {boolean=} When set to true, an asterisk will not be appended to the floating label.
+ * @param md-no-asterisk {boolean=} When set to true, an asterisk will not be appended to the
+ * floating label. **Note:** This attribute is only evaluated once; it is not watched.
* @param {string=} aria-label Optional label for accessibility. Only necessary if no placeholder or
* explicit label is present.
* @param {string=} md-container-class Class list to get applied to the `.md-select-menu-container`
@@ -273,6 +274,10 @@ function SelectDirective($mdSelect, $mdUtil, $mdConstant, $mdTheming, $mdAria, $
var isReadonly = angular.isDefined(attr.readonly);
var disableAsterisk = $mdUtil.parseAttributeBoolean(attr.mdNoAsterisk);
+ if (disableAsterisk) {
+ element.addClass('md-no-asterisk');
+ }
+
if (containerCtrl) {
var isErrorGetter = containerCtrl.isErrorGetter || function() {
return ngModelCtrl.$invalid && (ngModelCtrl.$touched || (formCtrl && formCtrl.$submitted));
@@ -316,7 +321,6 @@ function SelectDirective($mdSelect, $mdUtil, $mdConstant, $mdTheming, $mdAria, $
inputCheckValue();
};
-
attr.$observe('placeholder', ngModelCtrl.$render);
if (containerCtrl && containerCtrl.label) {
diff --git a/src/components/select/select.scss b/src/components/select/select.scss
index 206d882362..8989525191 100755
--- a/src/components/select/select.scss
+++ b/src/components/select/select.scss
@@ -82,7 +82,7 @@ md-input-container > md-select {
// NOTE: When the input has a value and uses a floating label, the floating label will show the
// asterisk denoting that it is required
md-input-container:not(.md-input-has-value) {
- md-select[required], md-select.ng-required {
+ md-select[required]:not(.md-no-asterisk), md-select.ng-required:not(.md-no-asterisk) {
.md-select-value span:first-child:after {
content: ' *';
font-size: 13px;
@@ -105,7 +105,7 @@ md-select {
margin: 2.5*$baseline-grid 0 3*$baseline-grid + 2 0;
&[required], &.ng-required {
- &.ng-invalid {
+ &.ng-invalid:not(.md-no-asterisk) {
.md-select-value span:first-child:after {
content: ' *';
font-size: 13px;
diff --git a/src/components/select/select.spec.js b/src/components/select/select.spec.js
index 51a72c85e8..1fef1d0e6d 100755
--- a/src/components/select/select.spec.js
+++ b/src/components/select/select.spec.js
@@ -1023,6 +1023,26 @@ describe('', function() {
expect(label).not.toHaveClass('md-required');
}));
+ it('correctly adds the .md-no-asterisk class if the attribute is empty', function() {
+ var el = setupSelect('ng-required="isRequired" md-no-asterisk ng-model="someModel"');
+ var select = el.find('md-select');
+
+ expect(select).toHaveClass('md-no-asterisk');
+ });
+
+ it('correctly adds the .md-no-asterisk class if the attribute is true', function() {
+ var el = setupSelect('ng-required="isRequired" md-no-asterisk ng-model="someModel"');
+ var select = el.find('md-select');
+
+ expect(select).toHaveClass('md-no-asterisk');
+ });
+
+ it('correctly removes the .md-no-asterisk class if the attribute is false', function() {
+ var el = setupSelect('ng-required="isRequired" md-no-asterisk="false" ng-model="someModel"');
+ var select = el.find('md-select');
+
+ expect(select).not.toHaveClass('md-no-asterisk');
+ });
});
describe('view->model', function() {