在 angular 2 中的另一个组件中使用复杂类型对象

Question

我是 angular 2 的新手，我正在实施用户登录 page.If 输入的电子邮件已经存在 Web API returns 用户数据对象。目前我正在控制台中编写该对象。但我需要在 userExist.component.ts.

中使用该对象

这些'auth.component.ts'和'userExist.component.ts'是独立的控制器

auth.component.ts

export class AuthComponent implements OnInit {

 ( ......)
   
 userRegister() {
   
   ( ......)
    
   this.userService.loginRegisterUser(this.userRegisterModel)
      .subscribe(
      data =>{ 
        console.log(data); // working!!   
        this.router.navigateByUrl('/user-exist');   
      },     
      err => {
        alert(err);
        this.errors = err;
        this.isRegistering = false;
      }
      );
   }
}

userExist.component.ts

export class UserExistComponent implements OnInit {

  userRegisterModel:LoggedUserRegister = new LoggedUserRegister ();

  constructor(private route: ActivatedRoute, private router: Router, private userService: UserService,  private fb: FormBuilder,) {}
  
  ngOnInit() {
    this. userRegisterModel = // I need assign object from auth.component.ts
  }
}

任何人都可以告诉我如何在 userExist.component.ts

中读取 auth.component.ts 的对象

Answer 1

您需要使用一种使用共享 service/event 发射器的消息传递机制。在这种情况下，由于您的组件是独立的，因此使用 shared service.

示例

@Injectable()
export class sharedService {
 userRegisterModel:LoggedUserRegister ;
 constructor() {
}
 Initialize() {

}

 saveUser(input:any) {
    this.userRegisterModel = input;
 }

 getUser(){
    return this.userRegisterModel;
 }
}

然后里面AuthComponent

data =>{ 
        this.sharedService.saveUser(data);
        this.router.navigateByUrl('/user-exist');   
}

再次，如果您想要其他组件中的详细信息，请使用 getUser 方法

在 angular 2 中的另一个组件中使用复杂类型对象

Use complex type object In another component in angular 2

javascript

angular2-routing

angular