我正在为我的同事准备一个关于 Angular 状态管理主题的演示文稿。演讲的重点是创建“哑”组件,这些组件接受来自父组件的输入,在 UI 中呈现这些数据并在输出中发出变化。重要的是它们不存储自己的任何状态(computed
在 Angular v17+ 中只存储计算属性和信号)。这有助于我们的团队创建没有变化检测问题的组件,父组件和子组件之间的状态不会不一致,并且尊重单向数据流。
我将向其中一支团队介绍如何使用 Angular Forms,这意味着他们的组件实现了ControlValueAccessor
,也就是说他们也可以通过writeValue
方法来接受值。这意味着他们的组件确实具有内部状态,而且由于他们也可以从@Input
s 接受值,因此可能会出现奇怪的错误,尤其是在将它们与不使用 Angular Forms 的代码库集成时。
官方对这两种方法为何如此不同有何解释?
组件从@Input
s 获取值的方法如何与从 获取值的方法统一writeValue
? 是否有可能创建一个与 Angular Forms 兼容且不包含任何自身状态的组件?
有没有办法实现 Angular Forms,其中组件通过@Input
s(或input
Angular 17+ 中的信号)接收它们的值?
ChatGPT 建议如下:
@Input() value: any;
writeValue(value: any): void {
this.value = value;
}
但是从我对 Angular 的了解来看,写入@Input
是一个非常糟糕的主意,甚至在 Angular 17+ 中使用信号也不可能实现。