2

这个让我难住了。它上周工作，突然停止工作。我有 ng-show 的元素是可见的，即使它被评估为假。

在脚本中：

$scope.alerts = { message: '', success: false, error: false, notice: false };

在标记中：

<div class="alert success" ng-show="alerts.success">
    <strong>SUCCESS!</strong>
    <div>{{alerts.message}}</div>
</div>

出于测试目的，我在标记中放置了一个 {{alerts.success}} 以确保它确实评估为假，并且我可以确认它是。

知道为什么会发生这种情况吗？

ps：不幸的是，我不能发布比这更多的代码。

4

3 回答 3

4

显然，这是 1.2 版的一个已知问题 ( https://github.com/angular/angular.js/issues/4394 )。上周我们在我们的项目中引入了 ng-csp，但它不能很好地与 ng-show/hide 配合使用。我在下面添加了从https://groups.google.com/forum/#!topic/angular/w00KgEi1DLk获得的 css 片段，现在它工作正常。感谢您的回复！

@charset "UTF-8";

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak],
.ng-cloak, .x-ng-cloak,
.ng-hide {
  display: none !important;
}

ng\:form {
  display: block;
}
于 2013-12-10T20:46:11.363 回答
0

您的代码中必须发生其他事情。ng-show 能够检查对象属性。

这是一个工作的笨蛋。http://plnkr.co/edit/QliAbg7zfkWgTVUTuLVp?p=preview

于 2013-12-09T23:21:07.800 回答
0

您必须$scope.alerts.success = false;在回调函数内部编写。是的，$scope.alerts.success 的值将变为 false，因为它会正确显示{{alerts.success}}在您的标记中。

为了解决这个问题，您需要将 $scope.$apply 包装在变量赋值语句周围：

SomeService.DoSomething(function success() { /* Success Code */}, 
     function error() {
          $scope.$apply(function() {
              $scope.alerts.success = false;
          });
     })
);

Angular 并不是完全自动化的数据绑定。是的，它确实更新了变量中的值，但它没有自动更新 UI。当你在回调中改变一个值（包括 setTimeout），你必须用 $scope.$apply 包裹你的赋值代码，这样 Angular 才能更新 UI。

于 2013-12-09T20:33:42.543 回答