Javascript 将数据从角度保护传递到组件失败

我从一个警卫那里收到一组数据，这组数据包含预期的数据。我的问题是将数据集传递给我的组件

这是我的代码：

导出类UserEditorComponent实现OnInit、OnDestroy{
@输入（）
user=新用户（）；
构造函数（私有activatedRoute:activatedRoute）{}
私人订阅：订阅| null=null；
ngOnInit（）：void{
this.subscription=this.activatedRoute.data.subscripte（x=>{
console.log（“传入数据”，x）；//传入数据包含预期的数据（名称和年龄）
console.log（“Class Field user”，this.user）；//使用默认值初始化字段“user”
this.user.Name=x.Name；
this.user.Age=x.Age；
console.log（“检查用户”，this.user）；//用户未定义
});
}
}

答案取决于Angular的组件生命周期。让我们检查组件的生命周期会发生什么：

您定义了一个名为“user”的输入属性，并使用一个新的用户实例对其进行初始化

在构造函数之后，输入属性逐个接收属性绑定语法给出的值。这些属性中的每一个都将触发ngOnChanges生命周期的事件。在您的情况下，ngOnChanges将在构造函数之后和ngOnInit之前触发一次，因为只有一个输入属性

当属性绑定、事件绑定和放置在组件选择器上的指令得到正确管理时，将执行ngOnInit钩子。在这里，您尝试在“用户”输入属性上设置“名称”和“年龄”属性

根据您发布的代码片段，我猜是这样的：您初始化组件中的“user”属性，给它一个新的用户实例，但是在构造函数执行之后，如果您尝试从外部初始化它，就会丢失它

换句话说，如果您有这样一个选择器：

必须确保在父组件中应用了针对“用户”属性的属性绑定，如下所示：

此外，请确保给定给user属性的值是UserEditorComponent中预期的用户实例：如果发送未初始化的值（未定义），它将触发控制台日志中显示的错误

如果可以的话，您在UserEditorComponent中执行的初始化是无用的，因为它将被传入值覆盖。请改用以下语法：

@Input() user!: User;

告诉用户属性是一个用户实例，并且它将在构造函数之后以某种方式正确初始化（这需要TypeScript中的！字符）就足够了

编辑 检查github上的代码，我看到解析程序返回的对象被包装到“user”键中，因此解析程序订阅上的x参数被不正确地访问：

this.subscribtion=this.activatedRoute.data.subscribe（x=>{
this.user.Name=x..user.Name；//是this.user.Name=x.Name吗
this.user.Age=x.user.Age；//是this.user.Age=x.Age；
});
}

非常感谢您的详细解释，非常好！我非常努力地解决这个问题。我尝试了所有提到的建议，但我无法解决问题。我正在为Angular 8编写一系列教程。也许我对这个版本有问题？我正在处理Angular 10/11，它不会是第一个遇到版本冲突的案例。我在Github中添加了一个简单的演示项目，这可能比在这里发布大量代码要好，不是吗？你能看看我的密码吗？我期待任何建议@克里斯托弗，我来看看it@Christoph1972我已经向您的存储库发出了请求，您可以在那里检查解决方案。无论如何，正如我在回答中编辑的那样，解析器的数据被包装到用户密钥中，因此这是一个与数据访问相关的问题。无论如何，我已经做了一些改进，对代码进行了注释，以帮助您理解我为什么更改了这些东西。更多的事情需要改进，但没有更多的时间花。希望能有帮助。非常感谢你的工作，这对我非常有帮助！这是一个小小的错误/误解。在未来，我将对控制台输出进行更好的分析，可能会看到错误，但我目前经验不足。对不起！为什么VSC（ESlint）没有抱怨：this.User=x，因为它是一个类型不匹配？非常感谢你的建议，我会努力的！向意大利问好！