angular-router

问题 I was wondering if there is a way to name my routes in Angular7 so I could just call [routerLink]="myRouteName" instead of [ routerLink]="/my/route/path" . If so, how can I achieve this? 回答1: Considering you want to configure the routes names while you are creating the route configuration. Lets leverage routes' data property to add names to routes. (A small extra data in every route should not affect any performance). But first, let's create a class which conatains a static property for

问题 I was wondering if there is a way to name my routes in Angular7 so I could just call [routerLink]="myRouteName" instead of [ routerLink]="/my/route/path" . If so, how can I achieve this? 回答1: Considering you want to configure the routes names while you are creating the route configuration. Lets leverage routes' data property to add names to routes. (A small extra data in every route should not affect any performance). But first, let's create a class which conatains a static property for

问题 I have tried to reproduce my error in a stackblitz What I try to accomplish I am trying to have a route with a dynamic parameter, and have sub routes of that parameter. I want this module to be lazyloaded. I have made a working solution for the dynamic parameter using the :id definition in the route definition. I want the child routes to output in a different router-outlet. Specifically I want a component ( UserComponent ) loaded on the route user/:username - if the path is empty after the

问题 I have 4 routes in my app.routes. import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; export const pageRoutes: Routes = [ {path: '', redirectTo: 'home', pathMatch: 'full'}, {path: 'home', component: HomeComponent}, {path: 'transaction', loadChildren: './app/transaction.module#TransactionModule'}, {path: 'evidence', loadChildren: './app/evidence.module#EvidenceModule'} ]; @NgModule({ imports: [RouterModule.forRoot(pageRoutes)], exports:

问题 I'm trying to take advantage of a custom RouteReuseStrategy and for that I'd like to suspend any subscriptions when a component is detached and other things like scrolling to the proper position. I've checked for possible hooks, but apparently no additional lifecycle hooks have been added and OnDestroy isn't called. I tried to add my own onDetach and onAttach hooks, but neither the ActivatedRouteSnapshots nor the DetachedRouteHandle will give me the instance of the current component (just the

问题 I am using Angular 7 and facing an issue => after login the API GET calls successfully and the component receiving data too, but UI is not displaying that data. When I open the browser console, immediately the data gets populated on the UI and a warning is showing in the console. "core.js:15686 Navigation triggered outside Angular zone, did you forget to call 'ngZone.run()'?" I have googled this warning and found some workaround like this.ngZone.run() and call my API's inside it. But the

问题 Ok, so I want to publish my prebuilt angular module on some cdn, and then let some angular route be able to point to it and have it loaded. I haven't stepped the angular code yet, but there is probably a good reason I can't simply point the loadChildren to some random url and expect it to fetch and load the module. If you look at my code example, the only piece the works is when I have my prebuilt goo.umd.js module in the same directory as my index.html file. I have yet to find any example of

问题 I've been trying to write a canDeactivate guard to check a saving state from an observable stream and work accordingly. My service goes as this import { Injectable } from '@angular/core'; import { ReplaySubject } from 'rxjs/ReplaySubject'; import { Observable } from 'rxjs/Observable'; @Injectable() export class EditModelService { private savingModelDataSource = new ReplaySubject<boolean>(); savingModelData$ = this.savingModelDataSource.asObservable(); public setSavingModelData(state: boolean)

问题 Is there anyway to send data as parameter with router.navigate? I mean, something like this example, as you can see the route has a data parameter, but doing this it's not working: this.router.navigate(["heroes"], {some-data: "othrData"}) because some-data is not a valid parameter. How can I do that? I don't want to send the parameter with queryParams. 回答1: There is a lot of confusion on this topic because there are so many different ways to do it. Here are the appropriate types used in the

问题 My angular router needs to use the same component for both the parent & child route, but pass along data to differentiate between the parent and child routes. Current issue: the child route does not register any data from the sub-route. Routing module segment that defines relationship: { path: 'parent-path/:id', component: MyComponent, children: [{ path: 'child-path' component: MyComponent, data: {MY_DATA_KEY: MY_DATA_VALUE}, }] }, In the angular component: constructor( //... private readonly