【问题标题】:Need help understanding this code snippet需要帮助理解此代码段
【发布时间】:2017-01-02 07:43:52
【问题描述】:

谁能解释一下这个sn-p代码,它是一个角度过滤器,模块名称为ui.filters

angular.module('ui.filters').filter('unique', function () {

  return function (items, filterOn) {

    if (filterOn === false) {
        return items;
    }

    if ((filterOn || angular.isUndefined(filterOn)) && angular.isArray(items)) {
        var hashCheck = {}, newItems = [];

        var extractValueToCompare = function (item) {
            if (angular.isObject(item) && angular.isString(filterOn)) {
                return item[filterOn];
            } else {
                return item;
            }
        };

        angular.forEach(items, function (item) {
            var valueToCheck, isDuplicate = false;

            for (var i = 0; i < newItems.length; i++) {
                if (angular.equals(extractValueToCompare(newItems[i]), extractValueToCompare(item))) {
                    isDuplicate = true;
                    break;
                }
            }
            if (!isDuplicate) {
                newItems.push(item);
            }

        });
        items = newItems;
    }
    return items;
  };
});

【问题讨论】:

  • 此过滤器返回不同的对象列表。
  • 那你需要什么样的解释?一行一行?
  • Melzar 先生,我知道它会返回不同的对象列表。如果可能的话,我需要详细的逐行解释。无论如何,感谢您的回复 Mr.Melzar。
  • 好的,我可以看到有人已经这样做了:)
  • 好的,谢谢Melzar先生的回复。

标签: javascript arrays angularjs


【解决方案1】:

欢迎拉杰什,here is a working plunker of the filter

我做了一些更改(更正声明并删除未使用的变量)

angular.module('ui.filters',[]).filter('unique', function () {

  return function (items, filterOn) {

    //return items as it is if the filterOn is false
    if (filterOn === false) {
        return items;
    }

    // else execute this if loop when "filterOn = defined/undefined AND items is an array"
    if ((filterOn || angular.isUndefined(filterOn)) && angular.isArray(items)) {
        var newItems = [];

        var extractValueToCompare = function (item) {
            // checks if it item(argument) is an object AND filterOn is a string
            if (angular.isObject(item) && angular.isString(filterOn)) {
                return item[filterOn];
            } else {
                return item;
            }
        };

        angular.forEach(items, function (item) {
            var isDuplicate = false;
            // for first iteration of "angular.forEach" newItems is an empty array. but the value is pushed into "newItems" 
            // once if (angular.equals(extractValueToCompare(newItems[i]), extractValueToCompare(item))) is evaluated true
            for (var i = 0; i < newItems.length; i++) { // LOOP_1
                if (angular.equals(extractValueToCompare(newItems[i]), extractValueToCompare(item))) {
                    isDuplicate = true;
                    break;
                }
            }
            // if not duplicate the push into newItems so that it can iterated in
            // LOOP_1 defined above
            if (!isDuplicate) {
                newItems.push(item);
            }

        });
        // assign unique values
        items = newItems;
    }
    return items;
  };
});

使用 console.log 检查迭代中的不同值

【讨论】:

  • @Mr.Shashank Vivek,感谢您的回复。它肯定对我有帮助。我需要其他帮助,赋予函数的那些参数(项目和 filterOn)是用户定义的,对吗?
  • 是的,请参考 plunker 链接中的index.html。你可以玩弄它。
  • 谢谢,Shashank Vivek 先生。这很有帮助。
  • @dvrajesh:请将其标记为帮助他人的答案
猜你喜欢
  • 2010-11-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-01-27
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多