How to filter the data from the list and remove the existing room from the data in angular

data = [{
 id: "txv3vvBr8KYB",
 name: "room 1"
},{
 id: "txv3vvBr8KJB",
 name: "room 2"
},{
 id: "txv3vvBr8K",
 name: "room 4"
},{
 id: "txv3vvBr8LKP",
 name: "room 3"
},{
 id: "txv3vvBr8LDS",
 name: "room 5"
}]

roomList = [
 {
      room: {
        code: "r001",
        id: "txv3vvBr8KYB",
        name: "room 1",
        status: "FULL"
      }
    },
 {
      room: {
        code: "r002",
        id: "txv3vvBr8KJB",
        name: "room 2",
        status: "FULL"
      }
    },
 {
      room: {
        code: "r003",
        id: "txv3vvBr8LKP",
        name: "room 3",
        status: "FULL"
      }
    }
]

What I’m trying to do here is to filter the data from the roomList and remove the item from data when they are the same ids.

the expected output should be like this:

data = [{
     id: "txv3vvBr8K",
     name: "room 4"
    }{
     id: "txv3vvBr8LDS",
     name: "room 5"
    }]

I tried to use a filter and map.

this.data.filter((x: any) => this.roomList.map((y: any) => y['room']['id] === x['id']);

Answer

Probably best to first reduce() the room IDs to a Set and then filter() based on that:

const ids = roomList.reduce((a, {room: {id}}) => (a.add(id), a), new Set());
const result = data.filter(({id}) => !ids.has(id));

Complete snippet:

const data = [{
  id: "txv3vvBr8KYB",
  name: "room 1"
}, {
  id: "txv3vvBr8KJB",
  name: "room 2"
}, {
  id: "txv3vvBr8K",
  name: "room 4"
}, {
  id: "txv3vvBr8LKP",
  name: "room 3"
}, {
  id: "txv3vvBr8LDS",
  name: "room 5"
}];

const roomList = [{
    room: {
      code: "r001",
      id: "txv3vvBr8KYB",
      name: "room 1",
      status: "FULL"
    }
  },
  {
    room: {
      code: "r002",
      id: "txv3vvBr8KJB",
      name: "room 2",
      status: "FULL"
    }
  },
  {
    room: {
      code: "r003",
      id: "txv3vvBr8LKP",
      name: "room 3",
      status: "FULL"
    }
  }
];

const ids = roomList.reduce((a, {room: {id}}) => (a.add(id), a), new Set());
const result = data.filter(({id}) => !ids.has(id));

console.log(result);

---

Alternatively, if you really want to do it in a one-liner and performance is not that big of an issue, you can use some():

const result = data.filter(({id}) => !roomList.some(({room}) => room.id === id));

Complete snippet:

const data = [{
  id: "txv3vvBr8KYB",
  name: "room 1"
}, {
  id: "txv3vvBr8KJB",
  name: "room 2"
}, {
  id: "txv3vvBr8K",
  name: "room 4"
}, {
  id: "txv3vvBr8LKP",
  name: "room 3"
}, {
  id: "txv3vvBr8LDS",
  name: "room 5"
}];

const roomList = [{
    room: {
      code: "r001",
      id: "txv3vvBr8KYB",
      name: "room 1",
      status: "FULL"
    }
  },
  {
    room: {
      code: "r002",
      id: "txv3vvBr8KJB",
      name: "room 2",
      status: "FULL"
    }
  },
  {
    room: {
      code: "r003",
      id: "txv3vvBr8LKP",
      name: "room 3",
      status: "FULL"
    }
  }
];

const result = data.filter(({id}) => !roomList.some(({room}) => room.id === id));

console.log(result);