2016-09-26 2 views
0

첫 번째로 프론트 엔드를 구축하고 몇 페이지를 설정하여 스프링 부트를 연결합니다. in 백엔드.index.html 페이지가로드되지만 (각도 2 RC-7) 어떤 경로와도 일치 할 수 없음 : 콘솔의 '' '

그러나 색인 페이지가로드되지만 콘솔에 다음 오류가 표시됩니다.

core.umd.js:5995 EXCEPTION: Uncaught (in promise): Error: Cannot match any routes: ''

routes.config.ts

const appRoutes: Routes = [ 
    {path:'home', component: HomeComponent, useAsDefault: true}, 
    {path:'login', component: LoginComponent}, 
    //{ path: '**', component: Error404Page } 
    // {path: '/register', name:'Register', component: Register}, 
]; 

export const appRoutingProviders: any = [ 

]; 

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes); 

현재에만 로그인 페이지가 여기에, 준비는 구성 요소입니다

@Component({ 
    moduleId: module.id, 
    selector: 'login', 
    templateUrl:'./login.html' 
}) 

export class LoginComponent { 

    login:LoginModel = new LoginModel(); 

    constructor(public loginService:LoginService){ 
     console.log("Inside constructor...") 
    } 

    onSubmit() { 

    } 
} 

app.module.ts

@NgModule({ 
    imports: [BrowserModule, FormsModule, routing], 

    declarations: [AppComponent, 
     LoginComponent, HomeComponent,NavigationBar], 

    providers:[LoginService, appRoutingProviders], 

    bootstrap: [AppComponent] 
}) 
export class AppModule { 

} 

Angular의 최신 튜토리얼을 읽었는데 제대로 수행하고있는 것처럼 보입니다.

답변

0

당신은 라우팅에이없는 기본 경로,

참고을 설정해야합니다 확실하지만 useAsDefault 제거하지만 여전히 누군가

const appRoutes: Routes = [ 

{path:'',redirectTo:'home', pathMatch: 'full'}, //<<<===here 
{path:'home', component: HomeComponent}, 
{path:'login', component: LoginComponent}, 

]; 
에서를 확인해야한다 없습니다

AppComponent의 HTML 어딘가에 <router-outlet>이 있는지 확인하십시오.

+0

위의 작업을 수행 할 때 다음과 같은 예외가 발생합니다 : 경로가 잘못 구성되었습니다 : 'redirectTo와 구성 요소를 함께 사용할 수 없습니다.' – Drew1208

+0

내 실수. 응답을 업데이트했습니다. – micronyks

+0

노력해 주셔서 감사합니다. 이제 'LoginComponent'를로드 할 기본 콘센트를 찾을 수 없지만 메인 페이지는 여전히 렌더링됩니다. 링크를 클릭하면 페이지가 새로 고쳐집니다. – Drew1208

관련 문제