2017-06-14 97 views
2

不知道为什么我会收到以下消息。有没有其他人在AngularJS/Angular Material中遇到过这个问题?我究竟做错了什么?信息本身似乎有些模糊。mdInput消息显示在无效消息元素上调用动画:

mdInput messages show animation called on invalid messages element: 
md-input-container.md-block.md-icon-right.md-default-theme.md-input-has-value 
+1

我刚开始接触到这个,让我知道你是否找到了解决方案。 –

回答

4

老问题,但只是为了防止任何人遇到此问题,您需要为输入字段提供错误消息。错误是说它不能将错误消息动画到视图中,因为消息元素缺失。

在您的md-input-container中包含处理错误的ng-messages元素。举例来说,如果你有一种叫做myFrm名为email所需的电子邮件地址输入,你的代码将是这样的:

<form name="myFrm"> 
    <md-input-container> 
    <label>Email Address</label> 
    <input type="email" ng-model="myFrm.email" name="email" required/> 
    <div ng-messages="myFrm.email.$error"> 
     <div ng-message="required">Email address is required</div> 
    </div> 
    </md-input-container> 
    <!-- Other form elements.... --> 
</form> 
0

我只是有这种情况发生,即使错误信息未设置正确的方式Hooligancat说,我发现了一个问题。

我的问题原来是在我刚刚写的工厂中的函数返回另一个函数(在同一工厂)。我从来没有使用返回的值。当我实际使用该功能时,它也不失败。相反,ng-messages div的孩子已经失去了,当我深入研究错误时,我可以看到它。

令人困惑的是我成功地在其他几个组件中使用过这个工厂。

因此,如果您已经确认您的错误消息设置正确,那么您可能需要对自上次工作后添加或更改的任何代码进行详细搜索发现问题。

祝你好运!

编辑 - 当我发布这个,我去清理一些事情,问题回来了。
一位同事看了看发生了什么,发现我的工作版本与非工作版本的$范围不同。我们在父组件的html中放入了一个ng-if =“true”子句,这让事情起作用,但我仍然怀疑有一些我还没找到的东西。

更多信息 - 我在组件A中有一个表单,在组件B中有一个表单,而组件B在组件A中的表单指令中。将A中的表单指令移动到只在字段的周围,我需要它包含并确保表单B不是嵌套在表单A中也解决了问题。所以我更好地理解为什么这会导致它所做的问题。

如果你在这里试图找出你的问题是什么,我希望Hooligancat的修复是你所需要的!