Question

我一直在与Angular的项目中进行讨论（相当新的），没有重大问题，但已经碰到了一些我无法弄清楚的事情。

我有一个允许用户创建帐户的表单。在整个表单中，我对表单可能包含错误的地方（例如，密码不够长等）有错误消息传递。在每个单独的区域而不是一个区域，模板按照我预期的那样更新，不仅在此表单上，而且在其他区域上在项目中形成。

罪犯是这个人：

<div id="account-exists" ng-if="createAccountForm.$valid">
    <span class="error" 
        ng-show="error301" 
        translate>
        general.validations.account_exists
    </span>
</div>

使用ng-if将div正确插入DOM并且子跨度完好无损，但它仍然包含ng-hide类。 error301是一个布尔值，我根据从服务器返回的数据设置范围，使用开发工具可以看到它实际上正在更新到我期望的true。问题是，模板不会自动更新以显示错误。如果点击它会更新。

我认为，$scope.$apply()可以提供帮助，但会冻结模板。检查DOM显示它在某种意义上有所帮助，因为它在预期的幕后行为，控制器中的JS代码仍然运行，并且DOM正确更新。我的模板中有什么明显的东西我不见了吗？具体来说，为什么它会通过点击更新？并且有没有人在$scope.$apply()上经历模板冻结？

Answer 1

肯定没有解决$scope.$apply()冻结模板导致的潜在问题，但我至少能够通过直接操作DOM解决这个奇异错误的问题同 document.getElementById("account-exists").classList.remove("ng-hide");，以便在未激活摘要周期的情况下删除未被删除的ng-hide。

我首先想知道为什么会发生这种情况，但是现在，很高兴知道作为一种解决办法，这符合我的目的，并且就切换错误的状态而言可以在需要时简单地定位元素和remove("ng-hide");或add("ng-hide");。

Answer 2

如果您使用对象，它可能会有效。我无法解释原因，但在我的到期中它会有所帮助。

ng-show="errors.error301"

然后在控制器中

$scope.errors = {
   error301:false
}
...
...
...
$scope.errors.error301 = true;

Ng-show仅更新交互

2 个答案: