AuthenticationService 导致自动导航

Question

我有一个有角度的登录屏幕。但每次我尝试打开它（localhost：4200 /登录）时，它都会打开它，但会跳转到localhost：4200。

import { Component, signal } from '@angular/core';
import { Router } from '@angular/router';
import { GenericPanelComponent } from '../../common/generic-panel/generic-panel.component';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
import { TokenService } from '../../token/token.service';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { AuthenticationRequest, AuthenticationService } from '../../../services';

@Component({
  selector: 'app-login',
  standalone: true,
  imports: [GenericPanelComponent, MatCardModule, MatInputModule, MatFormFieldModule, MatButtonModule],
  templateUrl: './login.component.html',
  styleUrl: './login.component.scss'
})
export class LoginComponent {
  authRequest: AuthenticationRequest = { email: '', password: ''};
  errorMsg: Array<string> = [];

  primary: string = 'purple';
  accent: string = 'green';

  email = signal('');
  password = signal('');
  
  constructor(
    private router: Router,
    private authService: AuthenticationService,
    private tokenService: TokenService
  ) { };

  login(): void {
     this.errorMsg = [];
  }

  registerConsumer(): void {
    this.router.navigate( ['register-consumer']);
  }

  registerVendor(): void {
    this.router.navigate( ['register-vendor']);
  }
}

有趣的是，如果我注释掉“private authService：AuthenticationService”行，登录页面将保留在浏览器中。 AuthenticationService 已通过开放 api 生成。我想分享我的authentication.service.ts，但需要提示，我如何将其提供给您。

根据 Naren Murali（感谢您的评论），以下是构造函数和变量：

@Injectable({
  providedIn: 'root'
})
export class AuthenticationService {

    protected basePath = 'http://localhost:8088/api/v1';
    public defaultHeaders = new HttpHeaders();
    public configuration = new Configuration();
    public encoder: HttpParameterCodec;

    constructor(protected httpClient: HttpClient, @Optional()@Inject(BASE_PATH) basePath: string|string[], @Optional() configuration: Configuration) {
        if (configuration) {
            this.configuration = configuration;
        }
        if (typeof this.configuration.basePath !== 'string') {
            const firstBasePath = Array.isArray(basePath) ? basePath[0] : undefined;
            if (firstBasePath != undefined) {
                basePath = firstBasePath;
            }

            if (typeof basePath !== 'string') {
                basePath = this.basePath;
            }
            this.configuration.basePath = basePath;
        }
        this.encoder = this.configuration.encoder || new CustomHttpParameterCodec();
    }

定义的路线是：

export const routes: Routes = [
    {
      path: 'login',
      component: LoginComponent
    },
    {
      path: 'register-consumer',
      component: RegisterConsumerComponent
    },
    {
      path: 'register-vendor',
      component: RegisterVendorComponent
    },
    {
      path: 'activate-account',
      component: ActivateAccountComponent
    }
];

Answer 1

好吧，算了，算了！！！

我刚刚在控制台上发现了一条错误消息，直到现在才引起我的注意：No provider for HttpClient。

这样就很容易在No Provider for HttpClient下找到解决方案。

现在不再重定向了。我的错，对不起。