I want to be able to use the variable "selectedRole" from my login component in my authentication service. This is my login.component.ts code:
import { Component, ElementRef, Input, OnInit, ViewChild, NgModule } from '@angular/core';
import {NgForm} from '@angular/forms';
import { FormsModule } from '@angular/forms';
import { Router } from '@angular/router';
import {MatRadioModule} from '@angular/material/radio';
import { stringify } from 'querystring';
import {BrowserModule} from '@angular/platform-browser';
import { AuthenticationService } from "../authentication.service";
@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent implements OnInit {
constructor(private router: Router, private authenticationService: AuthenticationService) { }
ngOnInit(): void {
}
selectedRole='User';
userID = '';
password = '';
RoleSelection(role){
this.selectedRole = role;
}
Login(){
if(this.selectedRole === 'User'){
this.router.navigate(['/userpage']);
}
else{
this.router.navigate(['/adminpage'])
}
}
}
And this is my athentication service:
import { Injectable } from '@angular/core';
import { SignInData } from 'src/SignInData';
@Injectable({
providedIn: 'root'
})
export class AuthenticationService {
private readonly mockedUser = new SignInData('user1', '123');
private readonly mockedAdmin = new SignInData('admin1', '456');
isAuthenticated = false;
constructor() { }
Authenticate(SignInData: SignInData): boolean {
if(this.CheckLoginDetails(SignInData)){
this.isAuthenticated = true;
return true;
}
this.isAuthenticated = false;
return false;
}
private CheckLoginDetails(SignInData: SignInData): boolean {
return this.CheckUserID(SignInData.getUserID()) && this.CheckPassword(SignInData.getPassword());
}
private CheckUserID(userID: string): boolean {
return userID === this.mockedAdmin.getUserID();
}
private CheckPassword(password: string): boolean {
return password === this.mockedAdmin.getUserID();
}
}
in the CheckUserID() and CheckPassword() I want to implement a condtion, saying: if selectedRole === 'User' or if selectedRole === 'Admin', but this requires me to somehow import the selectedRole from the login component. I tried with the rxjs but it didn't work.
Just add selectedRole property to AuthenticationService class and set it from component.
import { Injectable } from '@angular/core';
import { SignInData } from 'src/SignInData';
@Injectable({
providedIn: 'root'
})
export class AuthenticationService {
public selectedRole = 'User';
private readonly mockedUser = new SignInData('user1', '123');
private readonly mockedAdmin = new SignInData('admin1', '456');
isAuthenticated = false;
constructor() { }
Authenticate(SignInData: SignInData): boolean {
if (this.CheckLoginDetails(SignInData)) {
this.isAuthenticated = true;
return true;
}
this.isAuthenticated = false;
return false;
}
private CheckLoginDetails(SignInData: SignInData): boolean {
return this.CheckUserID(SignInData.getUserID()) && this.CheckPassword(SignInData.getPassword());
}
private CheckUserID(userID: string): boolean {
if (this.selectedRole === 'User') {
}
else if (this.selectedRole === 'Admin') {
}
return userID === this.mockedAdmin.getUserID();
}
private CheckPassword(password: string): boolean {
if (this.selectedRole === 'User') {
}
else if (this.selectedRole === 'Admin') {
}
return password === this.mockedAdmin.getUserID();
}
}
and set it from component
RoleSelection(role){
this.authenticationService.selectedRole = role;
this.selectedRole = role;
}