AngularJS uses Filter custom filter to control ng-repeat to remove duplicate functions example-JS Tutorial-php.cn

AngularJS uses Filter custom filter to control ng-repeat to remove duplicate functions example

不言

Release： 2018-04-21 16:12:46

Original

1869 people have browsed it

This article mainly introduces AngularJS to use Filter custom filter to control ng-repeat to remove duplicate functions. It analyzes the definition of AngularJS custom filter and array filtering related operation skills in the form of examples. Friends who need it can refer to it

The example of this article describes how AngularJS uses Filter custom filter to control ng-repeat to remove duplicates. Share it with everyone for your reference, the details are as follows:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>www.jb51.net ng-repeat去除重复</title>
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>
<p ng-app="myApp" ng-controller="myCtrl">
  <p ng-repeat="x in items | unique:&#39;id&#39;">
    {{x.id}}---{{x.name}}
  </p>
</p>
<script>
  //AngularJs 自定义过滤器
  //1.使用过滤器，去除重复
  angular.module(&#39;common&#39;, []).filter(&#39;unique&#39;, function () {
    return function (collection, keyname) {
      console.info(collection);
      console.info(keyname);
      var output = [],
        keys = [];
      angular.forEach(collection, function (item) {
        var key = item[keyname];
        if (keys.indexOf(key) === -1) {
          keys.push(key);
          output.push(item);
        }
      });
      return output;
    }
  });
  var app = angular.module(&#39;myApp&#39;, [&#39;common&#39;]);
  app.controller(&#39;myCtrl&#39;, function ($scope) {
    //$scope.items = [1, 2, 3,2];
    //当前unique 的过滤只针对，对象数组过滤
    $scope.items = [
      { id: 1, name: &#39;zhangsan&#39; },
      { id: 2, name: &#39;lisi&#39; },
      { id: 1, name: &#39;zhangsan&#39; },
    ];
  });
</script>
</body>
</html>

Copy after login

Running results:

Related recommendations:

A brief discussion on the usage of $destory in AngularJS

How array filter filters array elements

The above is the detailed content of AngularJS uses Filter custom filter to control ng-repeat to remove duplicate functions example. For more information, please follow other related articles on the PHP Chinese website!