fix(input): show messages with nested forms

- Fixed support in Angular 1.3
- Fixed messages when input is in nested forms

Closes #6276. Fixes #6699.

package.json

@@ -5,6 +5,7 @@
  "keywords": "client-side, browser, material, material-design, design, angular, css, components, google",
  "homepage": "https://material.angularjs.org",
  "bugs": "https:/angular/material/issues",
+ "license": "MIT",
  "licenses": [
  {
  "type": "MIT",
@@ -16,13 +17,13 @@
  "url": "git:/angular/material.git"
  },
  "devDependencies": {
- "angular": "^1.4.7",
- "angular-animate": "^1.4.7",
- "angular-aria": "^1.4.7",
- "angular-messages": "^1.4.7",
- "angular-mocks": "^1.4.7",
- "angular-route": "^1.4.7",
- "angular-sanitize": "^1.4.7",
+ "angular": "^1.4.8",
+ "angular-animate": "^1.4.8",
+ "angular-aria": "^1.4.8",
+ "angular-messages": "^1.4.8",
+ "angular-mocks": "^1.4.8",
+ "angular-route": "^1.4.8",
+ "angular-sanitize": "^1.4.8",
  "angular-touch": "^1.4.8",
  "angularytics": "^0.3.0",
  "canonical-path": "0.0.2",
@@ -79,4 +80,4 @@
  "merge-base": "git merge-base $(npm run -s current-branch) origin/master",
  "squash": "git rebase -i $(npm run -s merge-base)"
  }
-}
+}

src/components/input/input.js

@@ -267,10 +267,13 @@ function inputTextareaDirective($mdUtil, $window, $mdAria) {
  }
 
  var isErrorGetter = containerCtrl.isErrorGetter || function() {
- return ngModelCtrl.$invalid && (
- ngModelCtrl.$touched ||
- (ngModelCtrl.$$parentForm && ngModelCtrl.$$parentForm.$submitted)
- );
+ return ngModelCtrl.$invalid && (ngModelCtrl.$touched || isParentFormSubmitted());
+ };
+
+ var isParentFormSubmitted = function () {
+ var parent = $mdUtil.getClosest(element, 'form');
+
+ return parent ? angular.element(parent).controller('form').$submitted : false;
  };
 
  scope.$watch(isErrorGetter, containerCtrl.setInvalid);

src/components/input/input.spec.js

@@ -74,6 +74,45 @@ describe('md-input-container directive', function() {
  expect(el.find('md-input-container')).toHaveClass('md-input-invalid');
  });
 
+ it('should show error on $submitted and $invalid with nested forms', function() {
+ var template =
+ '<form>' +
+ '<div ng-form>' +
+ '<md-input-container>' +
+ '<input ng-model="foo">' +
+ '<label></label>' +
+ '</md-input-container>' +
+ '</div>' +
+ '</form>';
+
+ var parentForm = $compile(template)(pageScope);
+ pageScope.$apply();
+
+ expect(parentForm.find('md-input-container')).not.toHaveClass('md-input-invalid');
+
+ var model = parentForm.find('input').controller('ngModel');
+ model.$invalid = true;
+
+ var form = parentForm.controller('form');
+ form.$submitted = true;
+ pageScope.$apply();
+
+ expect(parentForm.find('md-input-container')).toHaveClass('md-input-invalid');
+ });
+
+ it('should not show error on $invalid and not $submitted', function() {
+ var el = setup('ng-model="foo"', true);
+
+ expect(el.find('md-input-container')).not.toHaveClass('md-input-invalid');
+
+ var model = el.find('input').controller('ngModel');
+ model.$invalid = true;
+
+ pageScope.$apply();
+
+ expect(el.find('md-input-container')).not.toHaveClass('md-input-invalid');
+ });
+
  it('should show error with given md-is-error expression', function() {
  var el = $compile(
  '<md-input-container md-is-error="isError">' +