title: Angular Routing: Define Multiple Paths for Single Route
body: <p>I've seen several answers to this, but I'm not sure if they necessarily "fit" my scenario (I'm not trying to create parent/child routing relationships or anything like that). In my case I have a component that's responsible for adding new widgets, or editing existing widgets. My routes are defined like so:</p>
  
  <pre><code>const routes: Routes = [
    {
      path: 'widget/add',
      component: ManageWidgetComponent,
      canActivate: [CanActivateViaRoleGuard],
      data: { roles: ['Admin', 'User'] }
    },
    {
      path: 'widget/:id/edit',
      component: ManageWidgetComponent,
      canActivate: [CanActivateViaRoleGuard],
      data: { roles: ['Admin', 'User'] }
    },
  ];
  </code></pre>
  
  <p><code>path</code> is a <code>string</code> so it can't accept an array of values or anything like that. Is there a way to specify multiple paths for a single route so I don't have to duplicate the other parts of the route (the component, canActivate, and data parts)?</p>
  
  <p><strong>Note</strong>: The paths cannot be changed due to application requirements (i.e. I can't just make a single <code>manage</code> path).</p>
  
  <p><strong>Edit</strong>: My <code>ManageWidgetComponent</code> already has the correct logic for handling Create vs. Edit. That part's fine.</p>