路由器链接不能正常工作？

Question

我正在开发 Angular 2 Web 应用程序我是 Angular 2 的新手。我遇到了“路由器链接”问题，它无法正常工作。我创建了路由器文件，我还添加了组件文件的路径。

以下是我的代码： 这是路由器文件代码，我在网上也试过了，没用。请帮忙看看是哪个文件有问题。

路由器.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>

点击登录链接时，它必须重定向到登录页面，但它不起作用，请帮助我。

Answer 1

试试这个。

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

或

在你的 html 中添加一个函数

<a (click)="goToPage('login')"> </a>

在你的组件中，调用函数

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