Javascript 为什么'；使用表达式时是否更新ng show状态？

使用作用域变量时，让ng show正常工作没有问题：

（摘自html文件：）

就像我说的，这很有效。当我查看phone.battery.type未定义或为空的页面时，ng show会正确隐藏div。当我查看phone.battery.type为非空字符串的页面时，ng show会正确显示div。一切正常

我的问题是：当我使用！isEmpty（…）直接在ng show表达式中调用，而不是使用$scope.hasBattery作为中介，它不起作用。

以下是该版本的代码：

<li ng-show="{{!isEmpty(phone.battery.type)}}">
  <span>Battery</span>
  <dl>
    <dt>Type</dt>
    <dd>{{phone.battery.type}}</dd>
  </dl>
</li>

当我加载一个phone.battery.type为非空字符串（我希望ng show显示该字符串）的页面时，它无法显示div。我看到在加载数据后确实调用了isEmpty，并且正确返回false（因此ng show的表达式，！isEmpty（…）为true）。但看起来Angular并没有用这个表达式的值做任何事情

---

知道发生了什么吗？我会认为这是一个$scope。$apply问题，就像我在其他地方看到的那样，但是表达式似乎是使用最新的数据进行计算的。

看来{}}表示法意味着Angular only只对括号内的表达式进行一次计算和使用

听起来要么Angular在去年左右改变了对大括号的处理，要么我使用的这篇博客文章是错误的：

评论员西里尔·迪德、拉扎赫和穆罕默德·塞帕文德，感谢他们指出扔掉{{}解决了我的问题

我仍然非常惊讶Angular似乎不止一次地对表达式进行了计算--事实上，很多次，作为12次左右我不得不忽略从isEmpty调用的alert（）的证据

---

为什么Angular会对一个它知道它不会做任何事情的表达式求值？

为什么对表达式使用{{}}？我对Angular没有太多经验，但它不应该是

而不是

当您使用{{}对ng show/ng if etc中的表达式求值时，它只被求值一次。@Razah-不要这样认为。看：@Mohammad，但我看到警报至少发出了两次。最后一次调用它时，isEmpty返回false。那么不应该使用这个返回值吗？但是ng show不显示div。不，等等，{{}可以多次求值——例如，中演示的绑定变量——但是在角度指令字符串中，如ng show=“…”，它将只使用一次。或者至少这是我收集的，仍然希望我能找到一些指南，使这些东西更清楚！

phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams', '$http',
  function($scope, $routeParams, $http) {

    function loadData() {
      // fyi, the ?date nonsense below is to avoid browser cacheing of the json file 
      $http.get('phones/' + $routeParams.phoneId + '.json' + '?' + 
                new Date().getTime()).success(function(data) {
        $scope.phone = data; 
        $scope.hasBattery = !$scope.isEmpty($scope.phone.battery.type);
        // should i call some form of $scope.$apply() here? when i do,
        // i get a digest already in progress error. ng-show seems to 
        // update fine without a call to $apply
      });
    };

    $scope.isEmpty = function(str) {
      var retVal = (typeof(str) === undefined || !str || 0 === str.length);
      alert("isempty: returning " + retVal);
      return retVal;
    };

    $scope.hasBattery = false;
    loadData();
  }
]);

<li ng-show="{{!isEmpty(phone.battery.type)}}">
  <span>Battery</span>
  <dl>
    <dt>Type</dt>
    <dd>{{phone.battery.type}}</dd>
  </dl>
</li>

phonecatControllers.controller('PhoneDetailCtrl', ['$scope', '$routeParams', '$http',
  function($scope, $routeParams, $http) {

    function loadData() {
      $http.get('phones/' + $routeParams.phoneId + '.json' + '?' + new Date().getTime()).success(function(data) {
        $scope.phone = data; 
        // no longer do any evaluation of isEmpty here.
        // as before, I'm not calling $scope.$apply() at all
      });
    };

    // same code as before
    $scope.isEmpty = function(str) {
      var retVal = (typeof(str) === undefined || !str || 0 === str.length);
      alert("isempty: returning " + retVal);
      return retVal;
    };

    loadData();
  }
]);