title: default route with dynamic IDs
body: <p>Bascially I have a tab and each tab page is a child:</p>
  
  <p>Here is <code>TabIndexComponent.html</code>:</p>
  
  <pre><code>&lt;tab&gt;
      &lt;tab-page *ngFor="let t of tabs"&gt;
          &lt;a routerLink="{{t.id}}"&gt;{{t.name}}&lt;/a&gt;
      &lt;/tab-page&gt;
  &lt;/tab&gt;
  &lt;router-outlet&gt;&lt;/router-outlet&gt;
  </code></pre>
  
  <p>The <code>tabs</code> is returned from the server with an <code>id</code> field and a <code>name</code> field. The <code>id</code> field will be used to grab more info for each tab page which will show up in the <code>router-outlet</code>.</p>
  
  <p>Here is an excerpt of the routes:</p>
  
  <pre><code>{
      path: 'tab',
      component: TabIndexComponent,
      children: [
          {
              path: '',
              redirectTo: '???',
              pathMatch: 'full'
          },
          {
              path: ':id',
              component: TabComponent
          }
      ]
  }
  </code></pre>
  
  <p>My problem is how do I default the tab to the first tab page since I don't know the <code>id</code> of the first tab page at compile time. What should I put into the question marks in the above route?</p>
  
  <p>Or some dynamic routing at runtime?</p>