AngularJS中如何通过ng-show在输入未变更时展示提交提示？

你需要补全的判断逻辑要同时兼顾两个核心判断，才能不跟已有的必填提示冲突，精准匹配需求：

• 首先要识别出用户完全没对输入框做过修改的状态，直接用AngularJS表单自带的字段追踪属性即可：relationshipForm.otherRelationshipText.$pristine。这个属性会自动记录输入框自页面初始化后的交互状态，只要用户没有做过任何输入、修改操作，输入值和初始加载的内容完全一致，属性值就为true。
• 其次要加一个校验通过的前置判断：relationshipForm.otherRelationshipText.$valid。这个判断可以避免当输入框为空、格式不符合规则时，同时弹出“不能为空”和“不能提交未修改内容”两条重复的错误提示，逻辑上也顺——如果输入框本身都不符合校验要求，本来就该显示对应的格式/必填错误，不该弹出“内容未修改”的提示。

把这两个条件拼到ng-show里，完整的span代码如下：

<span style="color:red" ng-show="relationshipForm.$submitted && relationshipForm.otherRelationshipText.$pristine && relationshipForm.otherRelationshipText.$valid">  you cant update the same selected field </span>

顺带提个容易踩的低级错误：你现有代码里写的relationshipForm.$sumbitted是拼写偏差，AngularJS里标记表单是否被触发提交的内置属性是$submitted，少了个字母b，这个拼写错误会导致所有依赖提交状态的校验提示都无法正常显示，一定要修正。

如果你的实际场景拓展成“哪怕用户中途修改过输入内容、最后又把值改回了初始内容，也要触发这个提示”，那单靠$pristine就不够了——毕竟$pristine只要检测到用户有过修改操作，哪怕最后值改回去了，属性也会变成false。这种场景下就需要在表单初始化时，把输入框的初始模型值存在独立的scope变量里，提交时直接对比当前值和存下来的初始值是否完全相等即可。

内容的提问来源于stack exchange，提问作者Ishmeet Singh