AngularJS ng-show无法正常工作

时间:2014-06-18 23:46:46

标签: angularjs

我是棱角分明的新手并且已经因为简单的演出没有按预期工作而感到沮丧。

我想显示/隐藏div,具体取决于旗帜的状态(flightsProcessed)

fp: {{flightsProcessed}}
<div class="container-fluid" ng-show="flightsProcessed">
        aaa
    </div>

我有一个控制器,开头有类似的东西:

$scope.flightsProcessed = false;

之后,在$ http.success()触发的另一个函数中,我做了类似的事情:

$scope.flightsProcessed = true;

我的问题是,当flightProcessed = true时,为什么不显示div,尽管当我在它上面打印时,flightsProcessed = true?

我已尝试使用$ apply但我得到&lt; $digest already in progress&gt;

我做错了什么? 感谢。

4 个答案:

答案 0 :(得分:5)

当视图未更新时,通常是因为您认为正在修改的范围变量(flightsProcessed)不是您期望的实际范围变量。如果您在创建子范围的指令(如ng-repeat,ng-include,ng-view等)中,然后您为flightProcessed分配了一个无意中在其中创建新范围变量的值,则可能会发生这种情况。儿童范围。这会破坏模型绑定,从而不再传播对视图的更新。

要查看是否发生这种情况,请尝试:

  $scope.$parent.flightsProcessessed = true;

看看它是否解决了这个问题。

答案 1 :(得分:3)

您的观点正在复制该值。因此,当它稍后改变时,它没有看到那种变化。尝试创建一个返回值的范围函数,将其称为getFlightsProcessed或其他类似的东西。然后,只需将ng-show更改为指向范围函数getFlightsProcessed()

即可

学习新东西时很容易感到沮丧。但是,坚持下去,因为Angular值得学习。

答案 2 :(得分:2)

1 - Angular团队程序员建议,始终使用DOT ! 。这意味着,当你想要定义$ scope.something时,某些东西总是一个对象更好。(你想知道原因,搜索:()

2-范围。$ apply不仅仅是你的想法,当我的范围管理工作不起作用时,我会使用范围。$ apply来修复它, NOPE ,那里是一个很好的策略背后的范围。$ apply。

当您想要从角度世界的外部进行操作时,您必须触发范围。$ apply。例如:当你想在指令中使用scope.something时。

对于你的问题。你必须这样做:

在您的控制器中:

           $scope.flights = {};
           $scope.flights.flightsProcessed = false;// Notice that how I used a DOT

然后你可以做你想做的事情;

答案 3 :(得分:1)

显示更多代码?你有正确的想法。看看这个fiddle。它基本上显示了你想要做的事情。

HTML ..

<div ng-app>
  <h2>Todo</h2>
  <div ng-controller="Controller">
      <div ng-show="flightsProcessed">Aaaaa</div>
      <input type="button" name="Submit" value="Submit" ng-click="invert()"/>
  </div>
</div>

...角

function Controller($scope) {
    $scope.flightsProcessed = true;
    $scope.invert = function() {
        $scope.flightsProcessed = !$scope.flightsProcessed;
    };
}