Angular material ng-messages未出现在对话框中

时间:2015-12-29 16:41:25

标签: javascript html angularjs

我正在对话框中创建登录表单,并且没有出现相应输入的ng-messages。验证工作正常,因为输入被突出显示为红色,并且按钮被禁用,直到验证正确。

对话框的代码是                                                 

登录/创建帐户

                                                                                         

        <md-dialog-content>
        <form name="signinForm" id="Signin" class="md-dialog-content">

            <md-input-container class="flex-gt-sm">

                <input type="email" required class="signInText" id="emailAddress" name="emailAddress" ng-model="signIn.emailAddress"placeholder="Email Address" ng-model="resetPassword.email" ng-pattern="/^.+@.+\..+$/" />
                <div ng-messages="signinForm.emailAddress.$error" role="alert">
                    <div ng-message="pattern">
                        Please enter a valid email address
                    </div>
                </div>

            </md-input-container>
                <br>
                <md-input-container class="flex-gt-sm">

                    <input type="password" class="signInText" id="password" name="password" placeholder="Password" ng-model="signIn.password" />

                </md-input-container>
                <br>
                <md-button class= id="resetPassword" style='text-align:center' onClick="resetPassword()">
                    Reset Password
                </md-button>
                <br>
                <!-- Flat button with ripple -->
                <md-checkbox ng-model="signIn.RememberMe" aria-label="Remember Me">
                    Remember Me
                </md-checkbox>
                <br>
                <!-- Flat button with ripple -->
                <md-button class= id="signIn" ng-disabled="signinForm.$invalid" style='text-align:center' ng-click="signIn()">
                    Sign In
                </md-button>
            <md-progress-circular class="md-hue-2 md-busy" ng-show="login.loading" md-mode="indeterminate" style="margin:auto"></md-progress-circular>
        </form>


        </md-dialog-content>

这就是我创建对话框的方式

$mdDialog.show({
                controller: signInController,
                templateUrl: 'signIn.html',
                parent: angular.element(document.body),
                targetEvent: ev,
                clickOutsideToClose:true,
            })

我的模块正在使用ngMessages,如果我将loginform放在对话框之外,那么消息就会正确显示。

我将控制器创建为一个功能。控制器中没有多少

 signInController($scope, $mdDialog, $log) {

}

如果我将html放在对话框之外并进入单独的页面,它就能正常工作。

我看到这张贴在其他地方

1 个答案:

答案 0 :(得分:1)

Angular-material 1.1.0-rc具有已知的bug。我注意到您使用的是版本1.0.1,并且您可能遇到了相同的错误。

该错误会显示第一个错误消息,然后不会显示任何将来的错误消息,但该字段将突出显示为红色。

重现你案件中的错误:

  1. 打开对话框并输入无效的电子邮件。它将显示正确的错误消息。
  2. 清除输入和模糊。由于该错误,它不会显示任何未来的消息。在这种情况下,它应显示必需消息,但您也没有指定。即使你已经指定它也不会显示。
  3. 再次输入无效的电子邮件。再次,正如我在第2步中所说,它不会显示任何未来的错误消息。