본문 바로가기

[angular] passing static data to route. We can set the static data in route.moduleconst appRoutes: Routes = [ { path: '', component: HomeComponent }, { path: 'users', component: UsersComponent, children: [ { path: ':id/:name', component: UserComponent } ]}, { path: 'servers',..
[angular] authGuard, canActivate, canActivateChild We can make the guard like this.@Injectable() =>this is for authServiceexport class AuthGuard implements CanActivate, CanActivateChild { constructor(private authService: AuthService, private router: Router) { } canActivate(route: ActivatedRoute..
[angular] Outsourcing route config We can manage our route config separately from app.moudle.ts check this out!import { Routes, RouterModule } from "@angular/router";import { HomeComponent } from "./home/home.component";import { UsersComponent } from "./users/users.component";import..
[angular] redirecting and wildcard if there is access from the  path which you don't declare. hmm...like localhost:4200/somethingit could be error.You can not cover all other path.but don't worry, you can use wildcard to solve this problem.check this code!const appRoutes: Route..
[angular] Handling queryParams We can navigate to edit component with this code.this.router.navigate(['edit'],{relativeTo: this.route});but here is my question.How to preserve the queryParams?It is simple!. look at this one.this.router.navigate(['edit'],{relativeTo: this.route, query..
[angular] router nested we can make nested router.const appRoutes: Routes = [ { path: '', component: HomeComponent }, { path: 'users', component: UsersComponent, children: [ { path: ':id/:name', component: UserComponent } ]}, { path: 'servers', component: ServersCompone..
[angular] retrieve the data as number this code looks like no problem. but actually it could be error.this.route.params.subscribe( (params:Params) => { this.server = this.serversService.getServer(params['id']); } );let's look at this method. >> getServer(id:numb..
[angular] QueryParameters and Fragments set in html<a [routerLink]="['/servers', 5, 'edit']" [queryParams]="{allowEdit: '1'}" fragment="loading" href="#" class="list-group-item" *ngFor="let server of servers"> {{ server.name }} </..