How can I remove empty arrays and optimize my POST request?

I have a POST request for Angular, but it does not work correctly, I cannot understand what the problem is, can you suggest a solution?

The first time I add an element, it just adds an empty array.

The second time, the first element that I clicked on before is added, etc., sometimes empty arrays can still randomly skip

Here is the code:

component:

filmFiltered:Film[] = [];

selectFilm(data){
  this.filmFiltered = data;
  console.log(data);
}

likeFilm(){
  this.http.likeFilm(this.filmFiltered).subscribe(data=>{
    console.log(data);
  })
}

service:

likeFilm(film){
        return this.http.post('http://localhost:3000/favouriteFilm', film)
    }

json:

{
  "favouriteFilm": [
     [],
    {
      "name": "Film 1",
      "id": 26899533
    },
    {
      "name": "Film2",
      "id": 204457
    },
    [],
    {
      "name": "Film3",
      "id": 128616
    },
    {
      "name": "Film4",
      "id": 173084
    },
    [],
    {
      "name": "Film5",
      "id": 128373
    }
  ]
}