有任何示例可以使NGX合成与NGRX正确使用吗?

发布于 2025-01-18 11:59:51 字数 350 浏览 0 评论 0原文

我正在尝试为工作中的项目学习NGX Formely和NGRX,是否有人知道如何正确地获得NGX形式以正确地绑定/更新NGRX商店?

我可以使用选择器从商店初始化我的数据, 但是,每次我输入输入字段或下拉列表时,我都会获得

ERROR TypeError: Cannot assign to read only property 'purchaseType' of object

正式的文档,并没有专门提及NGRX的任何内容,但是想知道是否有人知道Github上的任何存储库,或者我可以用一些我可以用作示例来弄清楚是否有任何东西。我需要设置的任何选项或任何东西才能使其工作 我只是不确定如何充分触发国家的变化。

I'm trying to learn ngx-formly and ngrx for a project at work, does anyone know how to correctly get ngx-formly to bind/ update the ngrx store correctly?

I can get my data to initialize from the store using a selector,
but everytime I either type in an input field or dropdown, I get

ERROR TypeError: Cannot assign to read only property 'purchaseType' of object

Formly's docs do not specifically mention anything for ngrx, but was wondering if anyone knows of any reposoitories on github or something that I can use as an example to figure out if there are any options or anything that I need to set to get it to work
I am just not sure how Formly triggers the state change.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

若无相欠,怎会相见 2025-01-25 11:59:51

迟到总比没有好。这是您可以尝试的一些想法:

从中更改选择器:

@select(state => state.animals)动物$:observable< yany>;

以制作对象的副本:

@Select(state => structuredclone(state.animals))动物$:可观察到的< Any&gt ;;

请注意,这应该使选择结果可变。如果没有,您将需要一种替代克隆方法。使用可变的副本,NGX形式应能够根据需要使用该表格。对状态的任何更改都可以通过NGX Formally Field配置中的钩子来处理。类似的事情:

key: 'firstName'
hooks: {
  onInit: (field: FormlyFieldConfig) => {
    field.form.get('firstName').valueChanges.subscribe(newName => {
      this.store.dispatch(new FirstNameChanged(newName);
    });
  },
},

您也可以使用@viewchild来引用您的表格而不是观看单个字段:

@ViewChild(NgForm) form:NgForm;

ngAfterViewInit() {
  form.ValueChanges.subscribe(newValue => {
    this.store.dispatch(new MyAction(newValue));
  })
}  

最后,这是未测试的,我提出了一个可能会有所帮助的想法,但是您需要通过实施详细信息进行工作,以满足您的特定需求。

Better late than never. Here's a few ideas that you could try:

Change your selector from this:

@Select(state => state.animals) animals$: Observable<any>;

To make a copy of the object instead:

@Select(state => structuredClone(state.animals)) animals$: Observable<any>;

Note that this should make the Select result mutable. If not, you'll need an alternative clone method. With a mutable copy ngx-formly should be able to work with the form as needed. Any changes to the state can be handled via hooks in your ngx-formly field configurations. Something like this:

key: 'firstName'
hooks: {
  onInit: (field: FormlyFieldConfig) => {
    field.form.get('firstName').valueChanges.subscribe(newName => {
      this.store.dispatch(new FirstNameChanged(newName);
    });
  },
},

You could also use @ViewChild to reference your form instead of watching individual fields:

@ViewChild(NgForm) form:NgForm;

ngAfterViewInit() {
  form.ValueChanges.subscribe(newValue => {
    this.store.dispatch(new MyAction(newValue));
  })
}  

Lastly, this is not tested, I'm presenting an idea that may help, but you'll need to work through the implementation details to fit your specific needs.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文