組件沒有路由到另一個組件的頁面

美好的一天。我的問題是在RegistrationComponent中routelink的按鈕沒有路由到LogInComponent的頁面，我無法理解爲什麼。 Angular沒有通過任何錯誤。這是RouteComponent，它的觀點：組件沒有路由到另一個組件的頁面

import { Component } from '../Vendor/@angular/core'; 
import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from '../Vendor/@angular/router-deprecated'; 

import { LogInComponent } from './LogIn'; 

@Component({ 
    selector: 'reg', 
    templateUrl: './Views/RegView.html', 
    providers: [ROUTER_PROVIDERS], 
    directives: [ROUTER_DIRECTIVES, LogInComponent], 
    // styleUrls: ['../../Styles/bootstrap/bootstrap.css'] 
}) 

@RouteConfig([ 
    { 
     path: '/logIn', 
     name: 'LogIn', 
     component: LogInComponent 
    } 
]) 

export class RegistrationComponent { 

}

觀點：

> <from> 
>  <div class=".col-lg-"> 
>   <div> 
>    <input name="userName" placeholder="логин"> 
>   </div> 
>   <div> 
>    <input name="password1" placeholder="******"> 
>   </div> 
>   <div> 
>    <input name="password2" placeholder="******"> 
>   </div> 
>   <div> 
>    <button>Зарегестрироваться</button> 
>   </div> 
>   <div> 
>    <button [routerLink]="['LogIn']">Вход</button> 
>   </div> 
>  </div> </from>

這是LogInComponent，以whick RegistrationComponent應該航線：

import { Component } from '../Vendor/@angular/core'; 
import { RouteConfig, ROUTER_DIRECTIVES, ROUTER_PROVIDERS } from '../Vendor/@angular/router-deprecated'; 

import { RegistrationComponent } from './Registration' 

@Component({ 
    selector: 'logIn', 
    templateUrl: './Views/LogInView.html', 
    providers: [ROUTER_PROVIDERS], 
    directives: [ROUTER_DIRECTIVES, RegistrationComponent] 
}) 

@RouteConfig([ 
    { 
     path: '/registration', 
     name: 'registration', 
     component: RegistrationComponent 
    } 
]) 

export class LogInComponent { 
    constructor() { console.log("1");} 
}

觀點：

<from> 
    <div> 
     <div> 
      <input name="userName" placeholder="логин"> 
     </div> 
     <div> 
      <input name="password1" placeholder="******"> 
     </div> 
     <div> 
      <button>Войти</button> 
     </div> 
     <div> 
      <button [routerLink]="['Registration']">Регистрация</button> 
     </div> 
    </div> 
</from>

這是主要的ApplicationComponent。它應該調用（我希望這個詞是正確的）RegistrationComponent：

import { Component } from '../Vendor/@angular/core'; 

import { RegistrationComponent } from './Registration'; 


@Component({ 
    selector: 'app', 
    templateUrl: './Views/appview.html', 
    directives: [ RegistrationComponent ] 
}) 


export class AppComponent { 

} 
view: 
<reg></reg>

來源

2016-06-14 Amelina

我刪除providers: [ROUTER_PROVIDERS]到處除引導。我不知道它爲什麼會有所幫助，但現在一切正在進行。

來源

2016-06-15 18:18:29 Amelina

由於'ROUTER_PROVIDERS'應該只在根目錄提供一次，否則每個組件都會獲得另一個路由器實例。 –

@GünterZöchbauer，再次感謝你。你幫了我很多。 – Amelina

組件沒有路由到另一個組件的頁面

回答

相關問題