javascript - 角度页面重定向

Question

在我的 Angular 6 项目中，我正在尝试修复忘记密码部分。所以，它是这样工作的：

• 首先，用户在表单上输入他/她的电子邮件。

• 然后向用户发送一封电子邮件，当用户单击电子邮件中的链接时，会出现带有令牌的页面（例如 */login?token）。

• 然后用户在字段中输入新密码并单击“更新密码”按钮，“更新密码” 按钮使用submitForgot() 函数。一切正常，除了更新密码按钮。

• 当用户按下按钮时，按钮将用户再次重定向到登录页面。但是，当登录页面打开时，用户不能使用登录按钮。用户只有在刷新页面时才能使用登录按钮。

这是更新密码按钮：

<div class="m-login__action m-login__action--fit" *ngIf="isForgotPage">
    <m-spinner-button [options]="spinner" (click)="submitForgot()">Renew Password</m-spinner-button>
</div>

这是submitForgot()函数：

submitForgot() {
        this.spinner.active = true;
        if (this.validateForgotPass(this.f)) {
            this.forgotModel.token = localStorage.getItem('forgotParam');
            this.forgotModel.newPassword = this.model.password;
            debugger;
            this.authService.changePassword(this.forgotModel).subscribe(response => {
                    this.spinner.active = false;
                    this.authNoticeService.setNotice('Congrats. Your password has been changed.', 'success');
                    setTimeout(() => {
                        this.action = 'login';
                        this.actionChange.next(this.action);
                        this.authNoticeService.setNotice('You can login with your new password.', 'success');

                    }, 500);
                this.cdr.detectChanges();
                }, err => {
                    this.authNoticeService.setNotice( err.error.message, 'error');
                    this.cdr.detectChanges();
                }
            );
            this.cdr.detectChanges();
        }
        this.spinner.active = false;
    }

这是loginResponseSuccess()函数：

loginResponseSuccess(response){
        response.companyIdentifier != this.undefStr ? localStorage.setItem("companyIdentifier",response.companyIdentifier) : localStorage.setItem("companyIdentifier",'');
        response.username !=  this.undefStr ? localStorage.setItem("loggedin-username",response.username) : localStorage.setItem("loggedin-username",'');
        response.email !=  this.undefStr ? localStorage.setItem("loggedin-email",response.email): localStorage.setItem("loggedin-email",'');
        response.fullname != this.undefStr ?  localStorage.setItem("loggedin-fullname",response.fullname): localStorage.setItem("loggedin-fullname",'');
        localStorage.setItem("loggedin-user-id", response.id);
        localStorage.setItem("profile-pic",response.pic);
        this.isLoginValid = true;
        this.router.navigate(['/']);
        this.cdr.detectChanges();
    }

这是登录按钮的代码：

<div class="m-login__action m-login__action--fit">
    <a href="javascript:;" (click)="forgotPasswordPage($event)" class="m-link">
        <span translate="AUTH.GENERAL.FORGOT_BUTTON" class="forgotPassword">Forgot Password?</span>
    </a>
    <button type="submit" id="kt_login_singin_form_submit_button"
            class="btn btn-primary font-weight-bolder font-size-h6 px-8 py-4 my-3 mr-3 loginButton"
            (keydown.enter)="submit()" (click)="submit()">{{'AUTH.LOGIN.TITLE' | translate}}</button>
</div>

下面是登录按钮的submit()函数：

submit() {
        this.spinner.active = true;
        this.isLoginValid = false;
        if (this.validate(this.f)) {
            this.authService.login(this.model).subscribe(response => {
                if (typeof response !== this.undefStr) {
                    this.loginResponseSuccess(response);
                } else {
                    console.log("Auth validation works");
                    this.authNoticeService.setNotice(this.translate.instant('AUTH.VALIDATION.INVALID_LOGIN'), 'error');
                }
                this.spinner.active = false;
                this.cdr.detectChanges();
            }, error => {
                debugger;
                this.errors = this.errorHandler.filter((val) => val.name === error.name && error.status == 0);
                if(this.errors.length > 0){
                    this.authNoticeService.setNotice(this.errors[0].message, 'error');
                }else{
                    this.authNoticeService.setNotice(error.error.message, 'error');
                }
                this.cdr.detectChanges();
            });
        }
        this.spinner.active = false;
    }

这是身份验证服务中的changePassword()函数：

public changePassword(changePass: Passwordchange): Observable<any> {
        return this.http.post(this.API_ENDPOINT_CHANGEPASS, changePass)
            .pipe(
                map((result: any) => {
                    debugger;
                    if (result instanceof Array) {

                        return result.pop();
                    }
                    return result;
                }),
                tap(this.saveAccessData.bind(this)),
                catchError(this.handleError2)
            );
    }

标签： javascripthtmlangular