angular-router

问题 I'm not sure if this is the best way to implement this. If you have other opinions please share. I have to implement a multi inbox system where the user can have multiple emails grouped by different inboxes. For example: http://localhost/inbox/personal/ will show a list of emails in personal inbox, http://localhost/inbox/business/3 will show a list of emails in business inbox and will highlight email with id: 3 Routes look like this: const routes: Routes = [ { path: '', pathMatch: 'full',

问题 reason of using nested route for me is handling dynamically icon and back button for every page.i have abstract route because when i click to back button route params disappear and i put an abstract path to keep id and questionnaire type parameter in url.my abstract path is Questionaire { path: 'Home', component: HomeComponent,data:{icon:'fa-home'} }, { path: 'QuestionaireList', component: QuestionaireListComponent,data:{icon:'fa-list-ul',previousState:'/Home'} }, { path: 'Questionaire/

问题 I need to create routes at Angular application startup based on the data received from API (site map). 1. APP_INITIALIZER calls SettingsService.loadSettings to get the data from API 2. Data comes to ROUTES and desired routes are built. app.module.ts import { BrowserModule } from '@angular/platform-browser'; import { NgModule, APP_INITIALIZER } from '@angular/core'; import { HttpClientModule } from '@angular/common/http'; import { RouterModule, ROUTES } from '@angular/router'; import {

问题 I am trying to achieve the following: I have a mat-toolbar component in app.component.html that displays the main top navbar of the site. Below the toolbar is <router-outlet></router-outlet> . When a user navigates to the root at localhost:4200/ I want the top navbar to be visible and the all components associated with links in the navbar to be rendered under the top navbar. The problem now is that the top navbar is repeated twice when the user navigates to the root. Clicking the links, the

问题 I am using Google Chrome version 52 and I want to be able to run my application locally without a server by accessing index.html. I am able to hit the landing page of my application. However, when I try to navigate to another page or click on any buttons, it is unable to work. I have tried many ways, such as: Add script before import reference one and reference two Changing base href from / to ./ Changing router configurations to use hash and changing base href to <script>document.write('

问题 If I build a static site with the file structure: -index.html -blog/index.html And I put an Angular app with routing inside blog/index.html , then go to the route example.com/blog/page/2 , it goes to the correct blog page within the Angular application. In a sense, it opens /blog/index.html , and processes /page/2 within the Angular application. How? Why doesn't Apache (or Nginx) take precedence over that, and try to open /blog/page/2/index.html , and not finding it, show a 404? I think it's

问题 I want to check if a route exists in an angular project. For example user types http://localhost:4200/#/timestamp in the url bar and timestamp does not exist in the project, how will you be able to check without redirecting? 回答1: There is no way to check if the route path exists in the config, however you can do a redirect in configuration using ** in router config module. export const AppRoutes = [ { path: "", redirectTo: "home", pathMatch: "full" }, { path: '**', redirectTo: 'home'} ]; Or

问题 I defined a router for an Angular project. My router configuration is as follows: export const routes: Routes = [ { path: '', component: AppComponent, }, { path: 'hello', component: HelloComponent, }, ]; export const routing: ModuleWithProviders = RouterModule.forRoot(routes, { enableTracing: true }); When I run the project, I see the router lifecycle events triggered in the following order: Navigation Start, Routers Recognized, Guards Check Start, Child Activation Start, <----- Activation

问题 I want to make a child element to trigger it own click even , and don't respond to it parent element having [routerLink], the problem is the child element can't run it delete() function in (click)="delete()" it just follow it parent in [routerLink] (it navigate to /product/:id) <div class="item"> <!-- parent element --> <a [routerLink]="['/product/'+product.id]"> <div class="figure"> <div class="sides"> <div class="side"> <div class="card"> <img class="img" [src]="product.thumb"> <div class=

问题 I've defined my routes like this: const routes: Routes = [ { path: '', loadChildren: './tabs/tabs.module#TabsPageModule' }, { path: 'faq', loadChildren: './faq/faq.module#FaqPageModule' }, { path: 'terms', loadChildren: './terms/terms.module#TermsPageModule' } ]; @NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule] }) export class AppRoutingModule {} and like this: const routes: Routes = [ { path: 'tabs', component: TabsPage, children: [ { path: '', redirectTo: '/tabs/