在 Angular 中基于特定条件获取唯一 ID-js教程-PHP中文网

在 Angular 中基于特定条件获取唯一 ID

花韻仙語

发布： 2025-08-24 22:48:01

原创

587人浏览过

在 angular 中基于特定条件获取唯一 id

本文介绍了在 Angular 应用中，如何根据 JSON 数据中嵌套对象的特定条件筛选出唯一的 ID 值。通过使用 filter 和 map 方法，可以有效地从数据集中提取所需的信息，并确保结果的唯一性。本文将提供详细的代码示例和步骤，帮助你理解和应用这些技术。

数据准备

首先，我们需要准备包含数据的 JSON 数组。以下是一个示例数据结构，其中包含 id、fname、lname 和 personaldata 字段。personaldata 字段本身也是一个对象，包含 bloodgroup、country 和 email 字段。

const data =  [{
    "id":1,
    "fname":"Tes1",
    "lname":"Testname1",
    "personaldata":{
        "bloodgroup":"A",
        "country":"IN",
        "email":"[email protected]"
    }
},
{
    "id":12,
    "fname":"Tes2",
    "lname":"Testname2",
    "personaldata":{
        "bloodgroup":"B",
        "country":"US",
        "email":"[email protected]"
    }
},
{
    "id":13,
    "fname":"Tes3",
    "lname":"Testname3",
    "personaldata":{
        "bloodgroup":"A",
        "country":"IN",
        "email":"[email protected]"
    }
},
{
    "id":14,
    "fname":"Tes4",
    "lname":"Testname4",
    "personaldata":{
        "bloodgroup":"A",
        "country":"IN",
        "email":"[email protected]"
    }
}];

登录后复制

数据筛选

接下来，我们将使用 filter 方法根据 bloodgroup 和 country 的值筛选数据。以下代码筛选出 bloodgroup 为 "A" 且 country 为 "IN" 的数据项。

const filteredData = data.filter(d => d.personaldata.bloodgroup === "A" && d.personaldata.country === 'IN');

登录后复制

提取 ID

使用 map 方法从筛选后的数据中提取 id 字段。

BetterYeah AI

基于企业知识库构建、训练AI Agent的智能体应用开发平台，赋能客服、营销、销售场景 -BetterYeah

110

查看详情

const ids = filteredData.map(d => d.id);

登录后复制

去重

为了确保 id 的唯一性，可以使用 filter 方法进行去重。

const distinctIds = ids.filter((n, i) => ids.indexOf(n) === i);

登录后复制

完整代码示例

以下是完整的 Angular 代码示例，它结合了筛选、提取和去重步骤。

const data =  [{
    "id":1,
    "fname":"Tes1",
    "lname":"Testname1",
    "personaldata":{
        "bloodgroup":"A",
        "country":"IN",
        "email":"[email protected]"
    }
},
{
    "id":12,
    "fname":"Tes2",
    "lname":"Testname2",
    "personaldata":{
        "bloodgroup":"B",
        "country":"US",
        "email":"[email protected]"
    }
},
{
    "id":13,
    "fname":"Tes3",
    "lname":"Testname3",
    "personaldata":{
        "bloodgroup":"A",
        "country":"IN",
        "email":"[email protected]"
    }
},
{
    "id":14,
    "fname":"Tes4",
    "lname":"Testname4",
    "personaldata":{
        "bloodgroup":"A",
        "country":"IN",
        "email":"[email protected]"
    }
}];

const distinctIds = data
  .filter(d => d.personaldata.bloodgroup === "A" && d.personaldata.country === 'IN')
  .map(d => d.id)
  .filter((n, i) => ids.indexOf(n) === i);

console.log(distinctIds); // 输出: [1, 13, 14]

登录后复制