title: Passing an object into Angular 9/10 resolver
body: <p>I am stuck with passing object to the resolver in Angular 9/10. Any help will be deeply appreciated.</p>
  <p>I have a page <code>SearchUser.component.ts</code> from where I am navigating to another page <code>UserInfo.component.ts</code>. I am trying to pass the object in the resolver, which can execute my service with the user object model.</p>
  <p><strong>A) SearchUser.component.ts</strong></p>
  <pre class="lang-js prettyprint-override"><code>viewUser() {
      /*Data to be posted before the User info page is displayed*/
      let data = {
          &quot;UserId&quot;: 1 &quot;UserName&quot;: &quot;David&quot;,
          &quot;Department&quot;: &quot;Physics&quot;
  
      }
  
      /*STEP_1 Payload on the router*/
      const navigationExtra: NavigationExtras = { state: data };
      this.router.navigate(['Default/ApplicationDisplay', navigationExtra]);
  }
  </code></pre>
  <p><strong>B) resolve-user.guards.ts</strong><br />
  ( Here at Step 2 I am expecting the data which can be posted on the API) . But its showing null value.</p>
  <pre class="lang-js prettyprint-override"><code>import { Injectable } from '@angular/core';
  import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree, Resolve, Router } from '@angular/router';
  import { Observable } from 'rxjs';
  import { MyUserService } from '../services/my-user.service';
  
  @Injectable({
      providedIn: 'root'
  })
  export class ResolveApplicationDetailsGuard implements Resolve &lt; userList &gt; {
      private postData: any;
      constructor(private _myUserService: MyUserService, private router: Router) {
          this.postData = router.getCurrentNavigation().extras.state; //STEP_2 
      }
  
      resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable &lt; userList &gt; | Promise &lt; userList &gt; | userList {
          return this._myUserService.GetUsersData(this.postData);
      }
  
  }
  </code></pre>
  <p><strong>UserInfo.component.ts</strong></p>
  <pre class="lang-js prettyprint-override"><code>getUserInfo() {
      //STEP_3
      this.activatedRoute.snapshot.data['userList'];
  }
  </code></pre>
  <p><strong>app-routing.ts</strong></p>
  <pre class="lang-js prettyprint-override"><code>path: 'UserInfo',
      component: UserInfoComponent,
      resolve: {
          userList: UserInfoGuard
      }
  </code></pre>
  <p>Appreciate if anyone can point me the right direction as certainly I am missing something.</p>