javascript - ng-model 不会反射(reflect)变化？

Question

我构建了一个简单的购物车示例:

这 3 行是通过 ng-repeat 创建的。

我的目标:

当相关数量(红色箭头)超过 3 时，我希望黄色部分变为红色。

这就是我所做的:( http://jsbin.com/eXOgOpA/4/edit )

<div ng-repeat='item in items'>
    <span ng-class='{isMoreThan3: IsMoreThan3()}'>{{item.title }}</span>
    <input ng-model='item.quantity'>
    ...
</div>

其中 IsMoreThan3 是一个函数:

$scope.IsMoreThan3=function (){return $scope.item.quantity>3;};

哪里

.isMoreThan3
{
  color:red;
}

但它不起作用。(计算没问题，但颜色永远不是红色)。

问题:

如何修复 Controller 代码以获得模型的正确值？

换句话说:

Controller 如何知道当前的item.quantity？

注意我知道我可以将逻辑放入标记中，但我不希望那样。我希望 Controller 返回一个 true/false 值。

Answer 1

尝试:

<span ng-class='{isMoreThan3: IsMoreThan3(item)}'>{{item.title }}</span>

JS:

$scope.IsMoreThan3=function (item){
     return item.quantity>3;
};

原因是ng-repeat会创建自己的作用域，访问$scope.item不会访问循环中的当前项目