404 error when try to access a direct url in different modules with angular-cli server
<p>So, I'm trying to access directly the url using angular2, with angular-cli. So, when I access the url <strong><a href="http://192.168.56.103:3000/app" rel="nofollow noreferrer">http://192.168.56.103:3000/app</a></strong> the application and all modules and their paths works fine.</p>

<p>But when I tried to access the modules path directly (such as <a href="http://192.168.56.103:3000/employee/upload" rel="nofollow noreferrer">http://192.168.56.103:3000/employee/upload</a>) I got this error:</p>

<pre><code>upload:10 GET http://192.168.56.103:3000/employee/styles.e7a71cdafac175e58c1d2b9d347ab895.bundle.css 
upload:18 GET http://192.168.56.103:3000/employee/inline.d41d8cd98f00b204e980.bundle.js 
upload:18 GET http://192.168.56.103:3000/employee/styles.d6983b9a92d269fc6b29.bundle.js 
upload:18 GET http://192.168.56.103:3000/employee/scripts.916e0bd9d793165463ce.bundle.js 
upload:18 GET http://192.168.56.103:3000/employee/main.aa7bb73e6fe0d8821716.bundle.js 404 (Not Found)
</code></pre>

<p>It is something like, the Href Base is not the <a href="http://192.168.56.103:3000/" rel="nofollow noreferrer">http://192.168.56.103:3000/</a> root, but it is <a href="http://192.168.56.103:3000/employee" rel="nofollow noreferrer">http://192.168.56.103:3000/employee</a>. So for that reason, my application got some errors to not found those files. So How can I solve that problem in angular2 with angular-cli server?</p>

<p>Also, I tried to add an base Href in my module, but nothing happens and the error still the same:</p>

<pre><code>import { CommonModule, APP_BASE_HREF }   from '@angular/common';

@NgModule({
  imports: [
  ],
  declarations: [

  ],
  providers: [
     ....
    {provide: APP_BASE_HREF, useValue : '/' }
  ]
})
...
</code></pre>

<p>My routing is showed below:</p>

<pre><code>import { ModuleWithProviders }  from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
...

const entity : string = 'employee';

const employeeRoutes: Routes = [
    { path: entity,
        children: [
        { path: '', redirectTo: 'list', canActivate: [AuthGuard] },
        { path: 'list', component: ListComponent, canActivate: [AuthGuard] },
        { path: 'upload', component: UploadComponent, canActivate: [AuthGuard] },
        { path: 'edit/:id', component: EditComponent, canActivate: [AuthGuard] }
        ]
    }
];

export const employeeRouting: ModuleWithProviders = RouterModule.forChild(employeeRoutes);
</code></pre>

<p>Need some help please.
Thanks!</p>