Angular Material ng-messages 未出现在对话框中答案

【问题标题】：Angular material ng-messages not appearing in dialogAngular Material ng-messages 未出现在对话框中
【发布时间】：2015-12-29 16:41:24
【问题描述】：

我正在对话框中创建一个登录表单，但没有出现相应输入的 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，如果我将登录表单放在对话框之外，那么消息就会正确显示。

我将我的控制器创建为一个函数。控制器中还没有太多内容

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

}

如果我将 html 放在对话框之外并放入单独的页面，它可以正常工作。

我看到这是在别处发布的

【问题讨论】：

你能提供同样的小提琴吗？没有它就很难调试..
我在用棱角材料制作小提琴时遇到了麻烦，但在 searchCollege.me 上有一个网站。右上角的按钮显示一个搜索对话框，其中没有错误消息。 scripts/header 文件夹中的文件 headerController.js 创建控制器。 signIn.html 在主目录中

标签： javascript html angularjs

【解决方案1】：

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

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

在您的情况下重现错误：

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

【讨论】：