Question

所以我以此为数据。我希望能够获得所有标签而无需重复。无论如何，我可以使用Angular从JSON中获得它吗？

var data = [
  { "id" : 1, 
     "title" : "title 1", 
     "description" : "Lorem Ipsum.", 
     "tags" : [
        { "tag": "facebook" },
        { "tag": "twitter" }
     ]
  }, 
  { "id" : 2, 
     "title" : "title 2", 
     "description" : "Lorem Ipsum.", 
     "tags" : [
        { "tag": "google" },
        { "tag": "twitter" }
     ]
  },
  { "id" : 3, 
     "title" : "title 3", 
     "description" : "Lorem Ipsum.", 
     "tags" : [
        { "tag": "reddit" },
        { "tag": "instagram" }
     ]
  }, 
  { "id" : 4, 
     "title" : "title 4", 
     "description" : "Lorem Ipsum.", 
     "tags" : [
        { "tag": "reddit" },
        { "tag": "9gag" }
     ]
  }
]

我希望代码的输出为： var tags = [“ facebook”，“ twitter”，“ google”，“ reddit”，“ instagram”，“ 9gag”]

Answer 1

有这样一种普通的简单方法。使用forEach和findIndex。

var data = [
  {
    "id": 1,
    "title": "title 1",
    "description": "Lorem Ipsum.",
    "tags": [
      { "tag": "facebook" },
      { "tag": "twitter" }
    ]
  },
  {
    "id": 2,
    "title": "title 2",
    "description": "Lorem Ipsum.",
    "tags": [
      { "tag": "google" },
      { "tag": "twitter" }
    ]
  },
  {
    "id": 3,
    "title": "title 3",
    "description": "Lorem Ipsum.",
    "tags": [
      { "tag": "reddit" },
      { "tag": "instagram" }
    ]
  },
  {
    "id": 4,
    "title": "title 4",
    "description": "Lorem Ipsum.",
    "tags": [
      { "tag": "reddit" },
      { "tag": "9gag" }
    ]
  }
];



let uniqTags = getUniqTags(data);
console.log(uniqTags);

function getUniqTags(data) {
  let res = [];
  data.forEach(d => {
    d.tags.forEach(f => {
      let fIndex = res.findIndex(r => r === f.tag);
      if (fIndex === -1) {
        res.push(f.tag)
      }
    });
  });
  return res;
}

Answer 2

您可以将Set与flatMap()操作一起使用。

flatMap()操作将从各种对象中收集所有标签，而在Set中收集它们将删除重复的标签。

const tags = [...new Set(data.flatMap(d => d.tags.map(t => t.tag)))];

完整代码段：

const data = [{
    "id": 1,
    "title": "title 1",
    "description": "Lorem Ipsum.",
    "tags": [{
        "tag": "facebook"
      },
      {
        "tag": "twitter"
      }
    ]
  },
  {
    "id": 2,
    "title": "title 2",
    "description": "Lorem Ipsum.",
    "tags": [{
        "tag": "google"
      },
      {
        "tag": "twitter"
      }
    ]
  },
  {
    "id": 3,
    "title": "title 3",
    "description": "Lorem Ipsum.",
    "tags": [{
        "tag": "reddit"
      },
      {
        "tag": "instagram"
      }
    ]
  },
  {
    "id": 4,
    "title": "title 4",
    "description": "Lorem Ipsum.",
    "tags": [{
        "tag": "reddit"
      },
      {
        "tag": "9gag"
      }
    ]
  }
];

const tags = [...new Set(data.flatMap(d => d.tags.map(t => t.tag)))];

console.log(tags);

Answer 3

您可以将flatMap（）与map（）一起使用。并使用Set（）删除重复项。

class Animal
  def speak
    :ok
  end

  def self.inherited(base)
    base.instance_variable_set(:@override, ->(*ms) {
      ms = ms - Animal.instance_methods
      puts "⚠️ #{ms.inspect} method(s) without super" \
        unless ms.empty?
    })
  end
end

class Dog < Animal
  @override[:speak]
  def speak; :ok; end

  @override[:eat]
  def eat; :ok; end
end

Answer 4

我想分享我的解决方案，因为某些解决方案使用的功能并非所有浏览器都支持。这是将标签数组简化为仅包含标签信息的字符串数组的方法

var data = [{"id": 1, "title": "title 1", "description": "Lorem Ipsum.", "tags": [{ "tag":"facebook" }, { "tag": "twitter" } ]},{"id": 2,"title": "title 2","description": "Lorem Ipsum.","tags": [{ "tag": "google" }, { "tag": "twitter" } ]},{"id": 3,"title": "title 3","description": "Lorem Ipsum.","tags": [ { "tag": "reddit" }, { "tag": "instagram" } ]},{ "id": 4,"title": "title 4","description": "Lorem Ipsum.","tags": [{ "tag":"reddit" },{ "tag":"9gag" }]}
];
   var result= data.map( (d)=> d.tags  )
         .reduce((a,b)=> a.concat(b),[])
         .reduce((e,f)=> { 
              if (!e.join().includes(f.tag)){  
                 e.push(f.tag); 
              } return e;  } 
         ,[]);
         
    console.log(result);

过滤多个标签

4 个答案: