【问题标题】:Angular logical expression does not update when scope changes范围更改时角度逻辑表达式不会更新
【发布时间】:2016-11-17 03:36:08
【问题描述】:

为什么内部作用域发生变化时,角度逻辑表达式不更新值?

我有一个指令 ng-show 在逻辑为真时显示一个 div:

<div ng-show="!employee.name && !employee.job"></div>

比如说:

$scope.employee.name = true;
$scope.employee.job = false;

将隐藏 div (!employee.name && !employee.job == false)。但是当我们使用 angular $http 动态更改员工时:

$http.get('/api/job').
success(function(data) {
    $scope.employee.name = data.name; // false
    $scope.employee.job = data.job; // false
}); // !employee.name && !employee.job == true

视图中的逻辑值不变:

<td><% employee.name %></td> <!-- false-->
<td><% employee.job %></td> <!-- false-->
<!-- !false && !false == true -->
<td><% !employee.name && !employee.job %></td> <!-- STILL FALSE -->
<!-- funny thing is no error occurred -->

这就是为什么 div 显示成功$http request 因为逻辑确实 得到更新?

<div ng-show="!employee.name && !employee.job"></div> <!-- does not show -->

【问题讨论】:

  • 你的逻辑是倒退的,只有当两者都为假时才会显示
  • 错字错误等待
  • 创建一个重现问题的演示。

标签: javascript jquery angularjs


【解决方案1】:

检查你的价值如果下面的例子如果改变像

var emp= {
 name:undefined,
  job:false
 }

然后ng-show保持之前的状态

var app = angular.module("myapp", []);
app.controller("myCtrl", ['$scope', function($scope) {
  
  var emp= {
  name:false,
  job:false
  }
   
  
  $scope.employee = emp;

  
}]);
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myapp">  
  <div ng-controller="myCtrl">    
  Name: {{employee.name}}   <br/>
    Job: {{employee.job}}   <br/>
    <br/>
    Condition Status : {{!employee.name && !employee.job}}
    
    <div ng-show="!employee.name && !employee.job">
      <h1>Div </h1>
    </div>
    
  </div>
</div>

【讨论】:

  • 因为 $scope.employee.name 和 $scope.employee.job 获得未定义的值,请参考@Harish Kommuri 解决方案
  • 嘿,伙计们,我发现出了什么问题,原来是employee.job == true,因为它作为字符串存储在那里for employee.job = "false" == true 我如何使“false”=false,就像布尔值一样?
猜你喜欢
  • 2017-09-28
  • 1970-01-01
  • 2018-06-15
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-03-24
相关资源
最近更新 更多