router-link工作不正常?

时间:2017-11-01 06:18:53

标签: angular2-routing angular2-forms

我正在开展角度2网络应用程序我是角色2的新手。我遇到了问题" router-link"它没有正常工作。我创建了路由器文件,并且还添加了组件文件的路径。

以下是我的代码:    这是路由器文件代码,我在互联网上尝试过但没有用。在哪个文件面临问题请帮帮忙。

router.ts:

import { Routes, RouterModule } from '@angular/router';
import { RegisterComponent } from './forms/register/register.component';
import { LoginComponent } from './forms/login/login.component';
const appRoutes: Routes = [
    { path: '' , component:LoginComponent},
    { path: 'signup', component: RegisterComponent},
    { path: 'login', component: LoginComponent},
    { path: '**', redirectTo: '' }
];
export const routing = RouterModule.forRoot(appRoutes);

register.component.ts:

import { Component, OnInit } from '@angular/core';
import {Validators, FormControl, FormGroup, FormBuilder } from '@angular/forms';
import { Router } from '@angular/router';


@Component({
  selector: 'app-register',
  templateUrl: './register.component.html'
})
export class RegisterComponent implements OnInit {

        error = '';
    loading = false;
    myForm: FormGroup;

    events: {}[] = [];

  constructor(private fb : FormBuilder,
                private router : Router) { }

  ngOnInit() {
          this.myForm = this.fb.group({
        username: ['', Validators.required],
        email: ['', Validators.required],
        passwords: this.fb.group({
            password: ['', Validators.required],
            confirmPassword: ['', Validators.required]
            })
        });
  }

}

register.html主要代码:

    <div class="form-header login-header">
      <h3>Hello User!!!</h3>
      <p>Already have an account? <a [routerLink]="['/login']">Login</a></p>
    </div>

点击登录链接时,必须重定向到登录页面,但它无法正常工作请帮帮我。

1 个答案:

答案 0 :(得分:0)

试试这个。

<a (click)="router.navigate(['/login']);"> </a>

OR

在你的html

中添加一个功能
<a (click)="goToPage('login')"> </a>

并在您的组件中调用函数

private goToPage(pageName: string) {
    this.router.navigate([`${pageName}`]);
  }