关于角度反应形式的问题,一种用于以反应式方式创建表格的角度技术。将此标记用于不是特定于单个Angular版本的问题。
导航到同一页面后,无法订阅 NgOnInit 中可观察的表单控件 valueChanges
我有一个使用不同参数导航到自身的页面。这使得 NgOnInit 不会再次执行。可悲的是,在 NgOnInit 中,我订阅了一个可观察的对象来处理值变化,我...
验证表单中是否至少填写了一个字段(复选框或其他文本字段),如果两者都为空,则在 Angular 中显示错误?
要验证表单中是否至少填写了一个字段(复选框或“otherText”字段),请为表单组创建一个自定义验证器。该验证器将检查是否在...
我有一个父组件:父列表包含两个子组件(第一个子列表,第二个子列表) 在第二个子列表组件中:我有一个 mat 表,用于接收要显示的数据...
@for 在removeAt(index) 上的表单表现得很奇怪
编辑:稍微改进了 stackblitz,以便人们可以并排比较它。 在 Angular 17+ 中,我想使用新的模板语法来迁移我的项目,这似乎有一个奇怪的行为......
打字稿 formGroup = this.fb.group({}); 构造函数(私有只读 formBuilder:UntypedFormBuilder){} ngOnInit() { this.setControls(); } settControls() { this.formGroup.addControl('名称', t...
所以,我有一个问题,我有一个带有表单的基础组件。但我希望能够向其中添加另一个字段。为什么?因为我有四个页面,结构非常相似,但有所不同......
如何将额外参数传递给 Angular 中的异步验证器(反应式表单)?
我有以下异步验证器。如果我想将它用于反应形式,我必须将它作为第三个参数传递 slug: [null, [Validators.required], [CustomValidators.slug]], 我怎样才能通过额外的
在严格模式下使用 Angular 11 和 Typescript 4 我有: 导出类 ContactComponent 实现 OnInit { 表单:表单组; 构造函数(私有formBuilder:FormBuilder){} ngOnInit() {...
如何使用 ssr 应用程序使我的 formControlName 在 Angular 17 的子输入组件中工作
我收到此错误: main.ts:6 ERROR 错误:NG01050:formControlName 必须与父 formGroup 指令一起使用。您需要添加一个 formGroup 指令并向其传递现有的 FormG...
我尝试创建一个 stackblitz 来展示我正在谈论的内容,但我根本无法让它工作,所以我只能寻求帮助。我有 2 个组件: 组件 1 是自定义表单
如何在不声明的情况下将 FormArray 添加到 FormGroup 中,并以编程方式添加
我试图学习为传递 json 的表单创建通用模板,将定义 所呈现的表的结构。 我无法将控件和表单数组添加到 fromGroup
我正在研究 Angular 反应形式。表格中的第一个问题询问用户最喜欢的水果是什么。我想添加一个“其他”选项。 我正在研究 Angular 反应形式。表格中的第一个问题询问用户最喜欢的水果是什么。我想添加一个“其他”选项。 <p> <label for="favFruit"><b>What's your favorite fruit</b></label> <br /> <input type="radio" value="Apple" id="favFruit" name="favFruit" formControlName="favFruit" /> Apple <br /> <input type="radio" value="Banana" id="favFruit" name="favFruit" formControlName="favFruit" /> Banana <br /> <input type="radio" value="Orange" id="favFruit" name="favFruit" formControlName="favFruit" /> Orange <br /> <input type="radio" value="Pear" id="favFruit" name="favFruit" formControlName="favFruit" /> Pear <br /> <input type="radio" value="Grapes" id="favFruit" name="favFruit" formControlName="favFruit" /> Grapes <br /> <input type="text" value="" id="favFruit" name="favFruit" formControlName="favFruit" /> </p> 我尝试过添加另一个值作为文本输入字段,但是,这允许用户选择多个选项。我希望当用户单击“其他”(选项)时弹出,以便用户可以选择其他,但这将是他们唯一的选择。 我建议用于填充其他值的 <input> 元素不要使用 formControlName 指令。 当输入文本字段时,它应该更新 favFruit 控制值,这会导致取消选中之前选中的单选按钮。 <input type="text" value="" id="favFruit" name="favFruit" #otherFavFruit (input)="onOtherFavFruitInput(otherFavFruit.value)"> onOtherFavFruitInput(value: string) { this.form.controls.favFruit.setValue(value); } 另一种情况是,当您在文本字段中输入其他值时,您改变主意并选择其中一个单选按钮,您可以使用 (change) 事件来重置输入字段。 <input type="radio" value="Apple" id="favFruit" name="favFruit" formControlName="favFruit" (change)="onFavFruitChecked($event)"> import { Component, ElementRef, ViewChild } from '@angular/core'; @ViewChild('otherFavFruit') otherFavFruit!: ElementRef<HTMLInputElement>; onFavFruitChecked(event: any) { this.otherFavFruit.nativeElement.value = ''; } 请注意,您可以使用 *ngFor 生成一组表单控件,旨在减少 HTML 中的代码。 <ng-container *ngFor="let fruit of fruits"> <input type="radio" [value]="fruit" id="favFruit" name="favFruit" formControlName="favFruit" (change)="onFavFruitChecked($event)"> {{ fruit }} <br> </ng-container> fruits = ['Apple', 'Banana', 'Orange', 'Pear', 'Grapes']; 演示@StackBlitz
如果我在 mat-dialog 中单击取消提交按钮,如何取消选中 mat-checkbox
我编写了一个对话框,其中包含要从表中删除的所有选定行。现在,当我提交对话框时,我希望也取消选中激活的复选框。 最好的方法是什么...
我有这个代码来检查两个密码是否匹配,但是,它没有按预期工作。我已经尝试过在一些旧问题中看到的内容,但没有成功。 我的组件模板中有这个...
带有嵌套 FormGroup 的 FormArray。如何访问嵌套的表单组控件?
我有一个包含 3 个 FormGroup 的 FormArray,每个表单组有 2 个控件。我不确定如何访问表单组中的控件来设置表单控件名称。 设置表格 这个.form = ...
我的 Angular/Ionic 表单遇到问题,无法在网络上正确显示表单控件。目前,我正在尝试实现一个动态表单,用户可以在其中输入
是否可以将一个 formArray 嵌套在其他 formArray 中并在 HTML 视图中正确显示? 我正在基于 API 响应构建分页表单,因此我正在迭代对
我正在 Angular 15 中开发一个应用程序,它显示动态查询的表单。我从后端获取表单参数。 我从后面得到这样的东西 { “鳕鱼Respuesta”...
我正在使用表单生成器构建动态表单,如下所示: 到目前为止我一直在 stackblitz 中尝试的可运行代码 我已阅读文档并看到了这个,例如但找不到另一个例子
我正在尝试使用给定的键名称和始终相同的键值构建角度形式。我已经成功构建了一种表单,但输出格式并不完全是我需要的格式。 更改键...