Javascript 是否可以在初始化组件后传递数据？

我有三个组件，如下图所示，并在功能组件中使用自定义表单组件。但是，这两个组件之间没有直接的父子关系，它们之间也有一个表单组件

我使用配置数据中包含输入值的

@Input

属性（比如“configData”）将数据从功能传递到表单，然后通过

@Input

属性（比如测试输入的“configData.test”）将数据传递到自定义组件，没有任何问题（初始化自定义组件时，我可以传递每个参数）。但是，在初始化之后，当我设置一个可以在初始化时传递的配置值时，自定义控件没有检测到它。我还尝试对该输入使用setter，如下所示，并等待捕获

ngOnChanges

方法上的更改。如果没有直接的父子关系，我不确定是否可以更新该值，但我避免在可重用的自定义组件中使用服务。那么，解决方案是什么？我是否必须通过服务传递价值

自定义组件。ts:

以下是我的组件的结构：

---

如果我理解正确，您的configData是一个对象，您只更新它的一些属性-如果是这种情况，您应该知道angular仅在对象引用更改时才会触发

如果情况确实如此，您可以通过以下方式之一克服它：

每次要更改

configData

对象时都重新创建它-

configData={…configData，newProp:newPropValue}Angular将了解这是一个新对象，并更新相关输入

您可以添加DoCheck lifecycle钩子-每次Angular runs更改检测时都会运行此钩子-因此请注意，这将触发更多次

传递输入不可变变量而不是可变变量-传递对象上的属性而不是作为对象传递

configData

向observable注册，它将在每次

configData

更改时触发，然后相应地更新组件

---

如果我理解正确，您的configData是一个对象，您只更新它的一些属性-如果是这样，您应该知道angular仅在对象引用更改时才会触发

如果情况确实如此，您可以通过以下方式之一克服它：

每次要更改

configData

对象时都重新创建它-

configData={…configData，newProp:newPropValue}Angular将了解这是一个新对象，并更新相关输入

您可以添加DoCheck lifecycle钩子-每次Angular runs更改检测时都会运行此钩子-因此请注意，这将触发更多次

传递输入不可变变量而不是可变变量-传递对象上的属性而不是作为对象传递

configData

向observable注册，它将在每次

configData

更改时触发，然后相应地更新组件

---

听起来问题可能是使用配置，然后使用@Input（）。第一个关系不使用@Input（）有什么原因吗？对不起，我解释错了，它也是通过@Input（）在配置中传递的，这意味着从第一个到第二个，从第二个到第三个组件，数据都是通过@Input（）传递的。那么，如何在初始化组件后捕获输入值呢？当原始值发生变化时，输入值应该更新，因此本质上应该向下传递。您是否更改了任何组件上的更改检测策略，b/c会影响更新如何发生/通过组件。感谢帮助，我的任何组件上都没有检测策略。这个问题似乎与莫斯扎罗斯回答的某些问题有关。我想我可以通过以下建议来解决这个问题。这听起来可能是因为使用了配置，然后使用了@Input（）。第一个关系不使用@Input（）有什么原因吗？对不起，我解释错了，它也是通过@Input（）在配置中传递的，这意味着从第一个到第二个，从第二个到第三个组件，数据都是通过@Input（）传递的。那么，如何在初始化组件后捕获输入值呢？当原始值发生变化时，输入值应该更新，因此本质上应该向下传递。您是否更改了任何组件上的更改检测策略，b/c会影响更新如何发生/通过组件。感谢帮助，我的任何组件上都没有检测策略。这个问题似乎与莫斯扎罗斯回答的某些问题有关。我想我可以通过以下建议来解决这个问题。问候。非常有用的建议，非常感谢，投票通过。我认为选项1似乎适合我。但我不确定如何使用扩展运算符等更新currentProp值。您是否也可以将其添加到您的答案中？另一方面，对于自定义组件，我认为使用选项4也会更好，但我不确定如何向observale注册。请您发布一个示例，以便我可以根据上的示例设置

mat autocomplete

值（filteredOptions）。您可以在该页面上查看第一个示例的html和ts文件。@Fredrick对于选项4，您必须使用服务，下面是一个示例-非常感谢，它似乎非常有用。但我只是想知道一个问题：在上图中，为了从自定义组件发射到特征组件，我首先需要发射到表单组件吗？那么，我是否必须通过触发第二个组件中的方法来发射呢？我的意思是第一个组件在第二个组件中发出一个方法，然后我从该方法发出事件

private _test: string;
@Input() set test(value: string) {
    this._test = value;
};
get test() { return this._test; }


ngOnChanges(changes: SimpleChanges) {
    console.log(changes);
    console.log(this.test);
}