angularjs - 如何在 ng-repeat 中分隔组

Question

我有我想显示的项目，通常使用 ng-repeat。我想按某种顺序显示(简单)，但是每当有序属性发生变化时，我都希望中间有一些 HTML。

示例:( Fiddle ):

<div ng-app ng-controller="Main">
   <div ng-repeat="item in items | orderBy:'role'">
        {{item.role}} - {{item.name}}
   </div>
</div>

function Main($scope){
    $scope.items = [{name: 'First', role: 1}, 
                    {name: 'Second', role:2}, 
                    {name: 'Third', role: 1}, 
                    {name: 'Fourth', role: 2}];
    }

我希望它打印:

1 - First
1 - Third
(some separator kode)
2 - Second
2 - Fourth

Answer 1

您将希望在您的范围内创建一个函数。

$scope.currentRole = 'something';
$scope.CreateHeader = function(role) {
      showHeader = (role!=$scope.currentRole); 
       $scope.currentRole = role;
      return showHeader;
}

然后在你的 HTML 中:

<div ng-app ng-controller="Main">
   <div ng-repeat="item in items | orderBy:'role'">
       <div ng-show="CreateHeader(item.role)">
       something here for the header
      </div>
        {{item.role}} - {{item.name}}

   </div>
</div>