时间戳

首页 > 解决方案 > 当数据传递到其他页面时，关联的打字稿模型消失

angular - 当数据传递到其他页面时，关联的打字稿模型消失

问题描述

我在角度应用程序中创建了一个打字稿模型。使用该模型初始化对象。我通过路由传递对象，但在第二个组件（即 UserComponent）上，关联的类型不是avialbe（在图像中突出显示）。下面是代码片段。Stackblitz 网址：https ://stackblitz.com/edit/tsmodel-test

模型

export class UserModel{
  name: string;
  id: number;
}

第一个组件

export class HelloComponent  { 
  user = new UserModel(); 

  constructor(private router: Router){}

  ngOnInit() {
    this.user.name = 'abdc';
    this.user.id = 23232
    console.log(this.user)
  }

  btnClick() {
    this.router.navigate(['user'], { state: {data: this.user} });
  }
}

第二部分

export class UserComponent implements OnInit {
  constructor(private route: ActivatedRoute) {}
  user;
  ngOnInit() {
    console.log('Component2')
    console.log(history.state.data);
    this.user = history.state.data;
  }
}

输出

输出

标签： angulartypescriptmodel

解决方案

控制台不显示打字稿类型，而是显示 javascript 类 UserModel。之后，您正在检索 History 对象的状态，我认为它是该对象的副本（待验证）。在两个组件之间传递对象不是正确的方法

推荐阅读