Question

我对Angular JS很新，但我总体上能理解JS。 Angular有一个完全不同的方法，所以我无法弄清楚如何做到这一点：

有一个对象数组，所以我可以按属性排序，并按照附加到输入“查询”的模型提供的字符串进行过滤。

一切正常，直到我需要保留按属性“group”分组的对象，当数组被输入中键入的关键字过滤时。

<input ng-model='query' type='text'>    
<div ng-repeat='reservation in reservations | filter: query | orderBy: "group"'>
  <span as-reset-list='{{$last}}'></span>
  <h2 ng-show='CreateHeader(reservation.group)'>Group</h2>
  <div>Group:  {{ reservation.group }} - ID: {{ reservation.id }}</div>
</div>

要打印一个标题，表示我正在使用currentGroup中定义的变量“$scope”，因此我可以与循环中的当前object.group进行比较。

function RestaurantCtrl($scope) {
  $scope.restaurants = [/* data */];
  $scope.currentGroup = '';

  $scope.CreateHeader = function(group){
    showHeader = (group!=$scope.currentGroup);
    $scope.currentGroup = group;
    return showHeader;
  }
}

但是当一个没有结果的搜索被创建并重复另一次搜索时，该变量会丢失该值或其他内容，以使分组不按预期工作。

我怎么能做到这一点？我已经尝试创建一个指令，所以我可以重置变量“currentGroup”的值，但它总是不起作用。

我的代码的工作示例在http://jsfiddle.net/5HZYt/

Answer 1

问题可能在于您的ng-model设置。看起来您正在将ng-model设置为一个简单的范围变量，当更改时，ng-model会丢失绑定。要避免这种情况，请尝试将ng-model设置为对象的属性，以便在值更改时，angular保留对对象的引用。

类似的东西：

$scope.modelObj = {prop:"This Value"};

然后..

<input ng-model='modelObj.prop' type='text'>

通过orderBy和/或过滤器修改ng-repeat时重置状态

1 个答案: