[英]How to send data to nested component (parent-child(parent)-child)?
I have three components (C1, C2, C3)nested, which means C2 is invoked in C1 and C3 is invoked in C2. 我有三个组件(C1,C2,C3)嵌套,这意味着C2在C1中被调用,而C3在C2中被调用。 I wanted to send the data which is in C1 to C3 via property binding. 我想通过属性绑定将C1中的数据发送到C3。
In C1's template, I did bind the variable, which I can receive in C2 via @Input and in C2's template, I did bind the same variable (@Input) but I am not getting in C3. 在C1的模板中,我确实绑定了变量,该变量可以通过@Input在C2中接收,而在C2的模板中,我确实绑定了相同的变量(@Input),但我没有进入C3。
It only works if I store the data in a temporary variable in C2 and bind the (temporary) variable in C2's template, can receive in C3. 仅当我将数据存储在C2中的一个临时变量中并在C2的模板中绑定(临时)变量时,它才可以工作。
So is it mandatory to store the data in a temporary variable or is there any workaround? 那么将数据存储在临时变量中是强制性的还是有任何解决方法?
Your nested C3 component should also be updated when C1 is updated. 当C1更新时,嵌套的C3组件也应更新。
Out of curiosity, I have created a simple stackblitz to try this out: https://stackblitz.com/edit/angular-i18qg3 出于好奇,我创建了一个简单的stackblitz进行尝试: https ://stackblitz.com/edit/angular-i18qg3
When "Update Variable" button is clicked, it updates rootVariable, which is binded to C2 and subsequently C3. 单击“更新变量”按钮时,它将更新rootVariable,该变量将绑定到C2,然后绑定到C3。
Do check if you have changed your change detection to onPush in C2 or C3. 请检查是否在C2或C3中将更改检测更改为onPush。
Taken from: https://blog.angular-university.io/onpush-change-detection-how-it-works/#onpushchangedetectionanddirectobjectmutability 摘自: https ://blog.angular-university.io/onpush-change-detection-how-it-works/#onpushchangedetection和直接对象可变性
This situation occurs because: 发生这种情况是因为:
- we mutated the user object directly 我们直接改变了用户对象
- but OnPush works by comparing references of the inputs of the component 但是OnPush通过比较组件输入的引用来工作
- because we did not provide a reference to a new object but instead mutated an existing one, the OnPush change detector did not get triggered 因为我们没有提供对新对象的引用,而是对现有对象进行了突变,所以未触发OnPush更改检测器
If we would change the implementation of changeUserName() to create a new user instance instead of mutating the existing instance , everything would work as expected 如果我们更改changeUserName()的实现以创建一个新的用户实例而不是对现有实例进行突变 ,那么一切都会按预期进行
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.