title: Angular2 Query Params Subscription Fires Twice
body: <p>Trying to handle an OAuth login scenario where if the user lands on a page with <code>authorization_code</code> in the query string, we process the token and continue <strong>or</strong> if they land on the page without that, we check local storage for their existing token, make sure it's still valid and either redirect to login or continue, based on its validity.</p>
  
  <p>The problem is that where we're checking for the existence of the <code>authorization_code</code> query string param, the subscription is firing twice. The first time it is empty, the second time it has the correct value in the dictionary.</p>
  
  <p><strong>app.component.ts</strong></p>
  
  <pre><code>export class App implements OnInit {
      constructor(private _router: ActivatedRoute) {
      }
  
      public ngOnInit(): void {
          console.log('INIT');
          this._route.queryParams.subscribe(params =&gt; {
              console.log(params);
          });
      }
  }
  </code></pre>
  
  <p>This code outputs:
  <a href="https://i.stack.imgur.com/Kaw6a.png" rel="noreferrer"><img src="https://i.stack.imgur.com/Kaw6a.png" alt="output"></a></p>
  
  <p><a href="https://plnkr.co/edit/XgCauzZdTSqqokCdFWCi?p=preview" rel="noreferrer">Plunker</a> (you'll need to pop it out into a new window and add a query string <code>?test=test</code>).</p>
  
  <p><strong>Questions</strong></p>
  
  <ol>
  <li>Is there something I'm doing wrong to make it fire twice?</li>
  <li>I can't just ignore the empty object with a conditional because that's the scenario where we need to validate the existing auth token -- is there another way of approaching this that isn't a complete hack?</li>
  </ol>