angular-reactive-forms 相关问题

patchValue 上的 Angular PrimeNG p 日历反应形式错误位置 2 出现意外文字

在 Angular 13 应用程序中，使用 PrimeNG Calendar 在 Angular 13 应用程序中，使用 PrimeNG Calendar <p-calendar [minDate]="today" [showIcon]="true" styleClass="form-control" showButtonBar="true" dateFormat="dd/mm/yy" inputId="icon" placeholder="dd/mm/yy" formControlName="eventStartDate"></p-calendar> 在反应式表单中使用，它在保存新表单时工作正常。我也使用相同的表单进行编辑。 编辑基于代码加载数据的表单。 但是当 patchValue 到表单时，出现错误 错误位置 2 出现意外文字 编辑代码 loadEventToEdit() { this.eventService.getEventByCode(this.eventCode).subscribe((res) => { this.event = res; console.log('the event to update', this.event); this.theForm.patchValue(res); 其余字段路径值工作正常。 在patchValue之前将日期设置为新日期。 loadEventToEdit() { this.eventService.getEventByCode(this.eventCode).subscribe((res) => { this.event = res; console.log('the event to update', this.event); this.event.timing.eventStartDate = new Date( this.event.timing.eventStartDate ); this.theForm.patchValue(this.event); 为需要修补资源的资源提供完整的路径。 对于 FormArray，你必须先制作 getter，然后你可以使用 Push 或 insert 方法来修补表单数组 loadEventToEdit() { this.eventService.getEventByCode(this.eventCode).subscribe((res) => { this.event = res; this.theForm.controls['eventStartDate'].patchValue(this.event.timing.eventStartDate); }) } 我也有类似的错误。 确保字段类型为日期，并将其设置为表单上 patchValue 之前的新日期。 一种方法是使用 DayJS。 let dates = [ dayjs(feature?.start_date, 'MM-DD-YYYY').toDate(), dayjs(feature?.end_date, 'MM-DD-YYYY').toDate(), ]; this.form.patchValue( { dateRange: dates || null }, { emitEvent: false, onlySelf: true, } ); P-Calendar 组件需要 Date 对象作为值，不能将其传递给其他类型的对象。因此，在修补时，请务必访问表单的控件并使用日期对象创建它。 response => { this.yourForm.controls['likeStartDate'].patchValue(new Date(response.startDate)); }

如何在 Angular 14 Reactive Forms 中使用 Pipe？

我们使用 Angular Reactive Forms 和管道来格式化数据，这在 Angular 9 中运行良好，但升级到 14 后。我们不能再在 Angular Reactive Forms 中使用管道了吗？ 期望...

Angular 6 getRawValue() 将不会返回禁用值

我有一个示例表格如下： 东西：IStuff； 构建表单（）{ this.createForm = this.form.group({ Val1: [{ 值: '', 禁用: true }], Val2: [{ 值: '', di...

Angular - 无法使用 Material Datepicker 取消订阅 valueChanges

我在 Angular Material Datepicker 中发出日期时遇到了一个持续的问题。我正在使用一个应用程序，其中 Contentstack 中有 JSON 文件。 JSON 文件具有以下控件：...

角反应形式的验证器无法正常工作？

我有这项服务，我正在尝试验证邮政编码字段，但是 (result ? null : { IsInvalid: true }) 永远不会执行。 反应式是否正常工作或者逻辑/用法错误？ @Injectabl...

nz-switch 由于更新值而无法正常工作

食品卫生链接 ... <form [formGroup]="businessFoodHygieneForm"> <div class="box p-4 d-flex jc-between ai-center"> <span> Food Hygiene Link </span> <label> <nz-switch class="switch-middle ms-2" formControlName="foodHygieneLink" (ngModelChange)="onFoodHygieneChange($event)"> </nz-switch> </label> </div> </form> .ts 组件： foodHygieneLink: new FormControl(''), onFoodHygieneChange(status: boolean): void { this.foodHygieneLink = status; const body = { foodHygieneLink: status ? 'Yes' : 'No' }; this.bizStore.dispatch( businessAction.updateBusiness({ body: body, bid: this.bid, }) ); } 我尝试使用nz-switch进行更新并成功更新，但如果开关更新为“否”，则开关按钮不起作用。它应该关闭，但始终开启。 我怀疑的是，可观察到的 foodHygieneLink 值可能是“是”或“否”，而不是布尔值。 因此，当值为 <nz-switch> 时，No 将被设置为打开。 您可以通过在将值设置为 foodHygieneLink FormControl 之前将“是”或“否”转换为布尔值来解决此问题。 this.businessFoodHygieneForm.patchValue({ foodHygieneLink: selectedBusiness?.foodHygieneLink === 'Yes', }); 演示@StackBlitz

如何清除 Angular Reactive Forms 中的 FormArray

我正在重置表单。它重置整个表单，但 FormArray 除外。 创建表单并在其中声明 formArray 创建表单（）{ this.invoiceForm = this.formBuilder.group({ '

删除表单数组元素反应形式角度

我正在尝试以角度反应形式从 formArray 中删除数组元素，因为我不想显示空数组元素。我需要删除所有控件都包含 null 值或

从 formArray 中删除 FormControl

我创建了我的FormGroup，如下所示 this.GSTNForm = this.formbuilder.group({ gstRegistrationStatusId: new FormControl(''), ReasonForNonApplicabilityofGST: new FormControl(''),

如何将选择选项绑定到输入字段

我试图从选择选项中获取一个值以绑定到输入字段，并且该值填充我的反应式表单中的表单属性。这是我的代码： 导入 'zone.js/dist/zone'; 导入 { 组件...

在 Angular 中确认密码验证

我有一个带有 2 个输入字段的重置密码表单： 新密码 新密码（确认） 我必须创建一个验证，其中“新密码（确认）需要匹配”新密码&...

角度反应形式避免空检查

我可以定义formControl的默认值类型为string而不是string |无效的？这样，当 formControl 值设置为 null 时，编译器会抛出错误，并且如果不检查 nu 则并不总是抛出错误...

日期管道不适用于设置了 FormControlName 属性的元素

使用反应式示例应用程序 我添加了 curr_date 表单控件，它有一个管道可以将日期格式化为所需的格式。 在 ts 文件中，表单组具有 curr_date 属性，该属性已预设...

ngIf 具有角度 15

我正在使用 Angular 15 开发一个 Web 应用程序。我正在使用反应式表单。我想在检索数据时显示 div，并在成功检索数据时隐藏它。我正在使用 *ngIf="

角度反应形式根据另一个字段的值有条件地验证字段

这是我的代码 详细信息组 = 新的表单组（{ 用户 ID:new FormControl('1'), 名字：new FormControl('', Validators.required), 姓氏：新的 FormControl('', Validators.required), ...

Angular 中的嵌套反应式表单：添加到表单数组时会触发 markAsTouched？

我目前正在开发一个涉及创建反应式表单的 Angular 应用程序。该表单旨在捕获用户信息以及相关客户的详细信息。主要形式

为什么角度表单自定义验证不起作用？

**大家好 我有角度项目，对于其中的注册表，我创建了一个用于密码，另一个用于确认密码，我收到了两个错误 第一：** 错误类型错误：

如何修复反应式表单验证中的“对象可能为空”错误？

在我的 .ts 文件中，我已将 null 设置为反应式表单的默认值，并使用反应式表单中的必需属性进行验证，如下所示： 从 '@angular/core' 导入 { Component, OnInit }; 导入 {

修补编译时不存在的表单组

我正在尝试按照这篇博客文章（方法 1）实现一个子表单示例。在博客文章中，还有一个 stackblitz 示例。该示例使用角度 10，我使用角度 16。 我的场景...

如何在 Angular 的动态 FormArray 中使用 patchValue？

在第一种情况下（工作演示链接）patchValue() 能够操作选择下拉菜单，其中反应式 FormGroup() 仅包含 FormControl() ，在第二种情况下我必须使用相同的