0
각도 개발을 처음 사용하고 응용 프로그램에 경로를 추가하려고 시도하지만 일부 경로에서는 정상적으로 작동하지만 잘 모르는 경로에서는 작동하지 않습니다. 내 경로 코딩 예에서 무엇이 잘못 되었나요? /events
경로가 작동 할 때 events/:id
경로도 작동하지만이 경로가 /test
일 때 작동하지 않습니다. 여기/2로 라우팅 할 때 각도 2가 "찾을 수 없음"을 표시합니다.
내 파일과 코드가
앱 component.js
import { Component } from '@angular/core'
@Component({
selector: 'event-app',
template: `
<navbar></navbar>
<router-outlet></router-outlet>
`})
export class EventAppComponent{ }
test.component.ts
import { Component } from '@angular/core'
@Component({
template: `<h1>Hello from testing component</h1>`
})
export class TestComponent{ }
routes.ts
import { Routes } from '@angular/router'
import { EventListComponent } from './events/events-list.component'
import { EventDetailComponent } from './events/event-details/event-detail.component'
import { CreateEventComponent } from './events/event-create.component'
import { Error404Component } from './error/404.component'
import { EventRouteActivator } from './events/events-route.activator.service'
import { EventsListResolverService } from './events/events-list.resolver.service'
import { TestComponent } from './test/test.component'
export const AppRoutes: Routes = [
{ path: 'events/new', component: CreateEventComponent },
{ path: '404', component: Error404Component },
{ path: 'test', component: TestComponent },
{ path: 'events', component: EventListComponent, resolve: {events: EventsListResolverService} },
{ path: 'events/:id', component: EventDetailComponent,
canActivate:[EventRouteActivator] },
{ path: '', redirectTo: '/events', pathMatch: 'full' },
]
을 제안 나에게주세요입니다
app-module.ts
import { NgModule } from '@angular/core'
import { BrowserModule } from '@angular/platform-browser'
import { RouterModule } from '@angular/router'
import { EventAppComponent } from './app.component'
import { EventListComponent } from './events/events-list.component'
import { EventListThumbnailComponent } from './events/events-list.thumbnail.component'
import { EventDetailComponent } from './events/event-details/event-detail.component'
import { NavbarComponent } from './nav/navbar.component'
import { EventService } from './events/events-service'
import { ToastrService } from './common/toastr.service'
import { CreateEventComponent } from './events/event-create.component'
import { Error404Component } from './error/404.component'
import { EventRouteActivator } from './events/events-route.activator.service'
import { EventsListResolverService } from './events/events-list.resolver.service'
import { TestComponent } from './test/test.component'
import { AppRoutes } from './routs'
@NgModule({
imports : [
BrowserModule,
RouterModule.forRoot(AppRoutes,
{ enableTracing: true })
],
declarations: [
EventAppComponent,
EventListComponent,
EventListThumbnailComponent,
EventDetailComponent,
NavbarComponent,
CreateEventComponent,
Error404Component,
TestComponent
],
providers: [
EventService,
ToastrService,
EventRouteActivator,
EventsListResolverService
],
bootstrap: [ EventAppComponent ]
})
export class AppModule{ }
'canActivate' 가드에게 선언 한 내용을 살펴보십시오. 어딘가에 추가하려는 경우, 활성화하려는 자식에 대한 액세스 권한을 부여해야합니다. – BogdanC