Reputation: 735
I'm having this issue with an Angular 5 project. All URL using localhost or even when hosted, a '#' is followed after the domain name. Can't find a reason for this.
app-routing.module.ts There are children routes for other components
const appRoutes: Routes = [
{ path: 'login', component: LoginComponent},
{ path: 'new-vendor-registration', component: NewVendorComponent},
{ path: 'new-vendor-card-add', component: NewVendorCardComponent },
{ path: 'forgot-password', component: ForgotPasswordComponent},
{
path: '',
redirectTo: 'dashboard',
pathMatch: 'full',
},
{ path: '', component: DashboardLayoutComponent, data: { title: '' }, children: DASHBOARD_ROUTES },
{ path: '', component: DashboardLayoutComponent, data: { title: '' }, children: USER_ROUTES, canActivate: [AuthGuard] },
{ path: '', component: DashboardLayoutComponent, data: { title: '' }, children: OFFER_ROUTES, canActivate: [AuthGuard] },
{ path: '', component: DashboardLayoutComponent, data: { title: '' }, children: PROMOTION_ROUTES, canActivate: [AuthGuard] }
// { path: '', component: TwoColumnsLayoutComponent, data: { title: '' }, children: TWO_COLUMN_ROUTES, canActivate: [AuthGuard] },
];
@NgModule({
imports: [RouterModule.forRoot(appRoutes)],
exports: [RouterModule]
})
app.module.ts
@NgModule({
declarations: [
AppComponent,
TwoColumnsLayoutComponent,
DashboardLayoutComponent,
LoginComponent,
NewVendorComponent,
NewVendorCardComponent,
ForgotPasswordComponent
],
imports: [
BrowserAnimationsModule,
NgxDatatableModule,
HttpClientModule,
FormsModule,
AppRoutingModule,
SharedModule,
NgbModule.forRoot(),
AngularFireModule.initializeApp(firebaseConfig),
AngularFireDatabaseModule,
AngularFireAuthModule,
MyDatePickerModule,
TextMaskModule
],
providers: [
{provide: LocationStrategy, useClass: HashLocationStrategy},
AuthService,
AuthGuard,
VendorService,
SalesrepService,
PaymentService,
SubscriptionService,
OfferService,
PromotionService,
WeatherService,
Broadcaster
],
bootstrap: [AppComponent]
})
export class AppModule {}
Any help is much appreciated.
Upvotes: 1
Views: 3753
Reputation: 13258
Here is the reason you are seeing the hash
{provide: LocationStrategy, useClass: HashLocationStrategy}
Read more about it here:
You most likely want this:
As per the Description
If you're using PathLocationStrategy, you must provide a APP_BASE_HREF or add a base element to the document. This URL prefix that will be preserved when generating and recognizing URLs.
For instance, if you provide an APP_BASE_HREF of '/my/app' and call location.go('/foo'), the browser's URL will become example.com/my/app/foo.
Similarly, if you add to the document and call location.go('/foo'), the browser's URL will become example.com/my/app/foo.
Upvotes: 3