Question

我有一个具有这种结构的范围变量：

var $scope.messages = [ 
  {
    id: '1',
    body: 'Foo',
    status: 'read'
  },
  {
    id: '2',
    body: 'Bar',
    status: 'read'
  },
  {
    id: '3',
    body: 'Hello',
    status: 'unread'
  },
  {
    id: '4',
    body: 'World',
    status: 'unread'
  },
]

在HTML布局中，我有这样的ng-show指令：

<div class="loaderContainer" ng-show="isAnyNewMessage() > 0">
   You have unread message(s)
</div>

function isAnyNewMessage(){
  var count = 0;
  for(var i = 0; i < $scope.messages.length; i++){
    if($scope.messages[i].status == 'unread'){
      count++;
    }
  }
  return count;
}

如果有.loaderContainer的消息，我想显示status: unread。如何实现正确的ng-show条件？

小提琴：http://jsfiddle.net/tdcbqdcg/1/

对不起，伙计们，我犯了一个错误。

评估函数（isAnyNewMessage）应该是$scope变量的成员，如下所示：

$scope.isAnyNewMessage = function() {
    var count = 0;
    for (var i = 0; i < $scope.messages.length; i++) {
        if ($scope.messages[i].status == 'unread') {
            count++;
        }
    }
    return count;
};

Answer 1

 $scope.isAnyNewMessage=function()  {
    var count = 0;
    for (var i = 0; i < $scope.messages.length; i++) {
        if ($scope.messages[i].status == 'unread') {
            count++;
        }
    }
    return count;
 }

Answer 2

如果你想要一个肯定有效的答案，你必须提供一个JSFiddle或你的整个控制器。但是，从你的代码：

ng-show是true或false变量。所以你可以在ng-show中调用你的函数，但要确保在isAnyNewMessage中返回true或false。

例如：

function isAnyNewMessage(){
  var count = 0;
  for(var i = 0; i < $scope.messages.length; i++){
    if($scope.messages[i].status == 'unread'){
      count++;
    }
  }
  return count > 0;
}

<div class="loaderContainer" ng-show="isAnyNewMessage()">
   You have unread message(s)
</div>

See the docs for ngShow.

AngularJS：NgShow评估集合中的对象属性

2 个答案: