组件不会路由到另一个组件的页面

时间:2016-06-14 18:14:15

标签: typescript angular

美好的一天。我的问题是注册中的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,注意到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>

1 个答案:

答案 0 :(得分:0)

除了开机以外,我删除了providers: [ROUTER_PROVIDERS]。我不知道它有什么帮助,但现在一切正常。