title: Angular: history.state.data returns undefined instead of the last set data object?
body: <p>I have a table of orders..each table row represents an order entity and when the user clicks on a specific row, it should redirect to a new view with the details of the clicked order .These two components are not parent and child and I want to pass data about clicked order row to the navigated page..
  I tried the following approach</p>
  
  <pre><code> &lt;tr *ngFor="let order of allOrders" routerLink="../orderdetails" [state]=”{data:order}”&gt;
                  &lt;td&gt;{{order.orderRef}}&lt;/td&gt;
                  &lt;td&gt;{{order.receiptRef}}&lt;/td&gt;
                  &lt;td&gt;{{order.customer}}&lt;/td&gt;
                  &lt;td&gt;{{order.orderDate}}&lt;/td&gt;
                  &lt;td&gt;{{order.salesMan}}&lt;/td&gt;
                  &lt;td&gt;{{order.total}}&lt;/td&gt;
                  &lt;td&gt;{{order.status}}&lt;/td&gt;
                  &lt;td&gt;{{order.session}}&lt;/td&gt;
                  &lt;td&gt;
                  &lt;/td&gt;
                &lt;/tr&gt;
  </code></pre>
  
  <p>This causes view to navigate to <code>Orderdetails</code></p>
  
  <pre><code> ngOnInit(): void {
      console.log(history.state)
      console.log(history.state.data);
    }
  </code></pre>
  
  <p>Inside the ngOnInit() <code>console.log(history.state)</code> logs <code>{navigationId: 1}</code>
  but <code>console.log(history.state.data)</code> logs <code>undefined</code>.</p>
  
  <p>Why am I getting <code>undefined</code> and not the data I set on the <code>state</code> ? </p>
  
  <p>How can I access the data I passed in to the <code>state</code> property?</p>