So i have this app where I'm getting data from my server and I want to display the result in a separate route. I tried using this line of code to send the data

.subscribe((result) => {
    console.log(result)
    this.router.navigate(['/results'], { state: { data: result } });
  });

The result here is an array of objects. The interesting thing is that when I use my small test object, which is an array of 3 objects, it works flawlessly. But when I try using a real result, which has about 21000 objects, I get an error. The only difference is the size of the result. I haven't found anything in the docs about a maximum size, so I was hoping somebody would be able to help me out

Edit:

The error message is (running on the ng serve dev server):

ERROR Error: Uncaught (in promise): [Exception... "Illegal value"  nsresult: "0x80070057 (NS_ERROR_ILLEGAL_VALUE)"  location: "JS frame :: http://localhost:4200/vendor.js :: pushState :: line 766

After that I get a very long stack trace.