如何在同一路由器出口上的一个组件与另一个组件之间传递数据 [英] how to pass data between one component to another which is on same router-outlet

查看:101
本文介绍了如何在同一路由器出口上的一个组件与另一个组件之间传递数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

app.component.html

我有两个组成部分 1)ResetPassword 2)LoginComponent 在同一路由器出口上.

I have two components 1) ResetPassword 2) LoginComponent on the same router-outlet.

成功重置密码.我正在重定向到登录组件. 如何将数据从ResetPassword传递到LoginComponent?

on successfully resetting the password. I'm redirecting to login component. How do I pass data from ResetPassword to LoginComponent?

我尝试使用订阅方法执行此操作,但这不起作用.

I tried using subscribe method to do this but that is not working.

有人可以帮我解决这个问题吗?

Can someone help me fix this.

LoginService

export class LoginService{

 private messageSource = new BehaviorSubject('');
    currentMessage = this.messageSource.asObservable();

setResetPassword(message: string) {
        this.messageSource.next(message)
    } 
}

LoginComponent

OnInit{

this._loginService.currentMessage.subscribe(message => {

    if (message !== undefined && message !== "") {
                this.toastr.info(message);
    }
});

}

ResetComponent

OnInit(){

this._loginService.setResetPassword("Password Changed Successfully");

}

推荐答案

LoginService中尝试以下代码.

import { Injectable, EventEmitter} from "@angular/core";

@Injectable()
export class LoginService {

   currentMessage = new EventEmitter();

   setResetPassword(message: string) {
      this.currentMessage.emit(message)
   } 
}

并在提交功能中移动 ResetComponent 代码.

And move your ResetComponent code in submit function.

resetPassword() {
   this._loginService.setResetPassword("Password Changed Successfully");
}

谢谢.

这篇关于如何在同一路由器出口上的一个组件与另一个组件之间传递数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆