如何使用Angular过滤器对数据进行分组？

任务是展示如何使用Angular过滤器对数据进行分组。

涉及的步骤：

1.您可以使用以下四种不同的方法安装角度过滤器：

• 克隆并构建https://github.com/a8m/angular-filter git存储库

• 通过Bower：通过运行$ bower在终端上安装angular-filter

• 通过npm：通过运行$ npm从您的终端安装angular-filter。

通过npm安装

• 通过cdnjs：将以下script-src添加到您的应用程序。

2.如下面的示例所示，在包含Angular本身之后，将index.html中包含angular-filter.js(或angular-filter.min.js)。

3.将“ angular.filter”添加到主模块的依赖项列表中。

示例：在此示例中，我们将使用角度过滤器按品种将狗分组。

HTML

  

    
    
      
    
    
      
    
    

  

  
    
        GeeksforGeeks
    
  
    
        A computer science portal for geeks
    
  
    
        
            Breed: {{ key }}
            
                
                    Dog name: {{ dog.name }}
                
            
        
    
  
  
    
        //(3)
        angular.module('myApp', ['angular.filter'])
            .controller('myCtrl', function ($scope) {
            $scope.dogs = [
                { name: 'Alex', breed: 'German Shepherd' },
                { name: 'Rocky', breed: 'Bulldog' },
                { name: 'John', breed: 'Beagle' },
                { name: 'Paula', breed: 'Bulldog' },
                { name: 'Bobby', breed: 'German Shepherd' }
            ];
        });
    

  

输出：