如何在反应式角度窗体上初始化时根据另一个窗体控件的值禁用该窗体控件？
在反应式角度窗体上初始化时根据另一个窗体控件的值禁用该窗体控件，可以通过以下步骤实现：
- 首先，在反应式角度窗体的组件类中，引入所需的模块和服务。例如，如果使用Angular框架，可以引入
FormControl和FormGroup模块。 - 在组件类中，创建一个
FormGroup对象，并在其中定义需要控制的窗体控件。例如，如果有一个名为control1的控件，可以这样定义：
formGroup: FormGroup;
constructor() {
this.formGroup = new FormGroup({
control1: new FormControl()
});
}- 在另一个窗体控件的值发生变化时，通过订阅该控件的值变化事件，来禁用或启用需要控制的窗体控件。例如，如果有一个名为
control2的控件，可以这样实现：
import { Subscription } from 'rxjs';
subscription: Subscription;
ngOnInit() {
this.subscription = this.formGroup.get('control2').valueChanges.subscribe(value => {
if (value === 'some value') {
this.formGroup.get('control1').disable();
} else {
this.formGroup.get('control1').enable();
}
});
}
ngOnDestroy() {
this.subscription.unsubscribe();
}在上述代码中，我们订阅了control2控件的值变化事件，并根据其值来禁用或启用control1控件。
这样，在反应式角度窗体初始化时，根据另一个窗体控件的值，可以动态地禁用或启用该窗体控件。
推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云云数据库MySQL。
- 腾讯云云服务器（CVM）：提供高性能、可扩展的云服务器实例，适用于各种应用场景。详情请参考腾讯云云服务器。
- 腾讯云云数据库MySQL：提供稳定可靠的云数据库服务，支持高并发、高可用的数据库访问。详情请参考腾讯云云数据库MySQL。
相关·内容
8回答
RangeError:使用valueChanges.subscribe时超过最大调用堆栈大小
angular、typescript、angular5、angular-reactive-forms
我使用的是具有响应形式的角5，需要使用valueChanges来禁用所需的动态验证。
组件类：
export class UserEditor implements OnInit {
public userForm: FormGroup;
userName: FormControl;
firstName: FormControl;
lastName: FormControl;
email: FormControl;
loginTypeId: FormControl;
password: FormControl;
confirmP
浏览 6提问于2017-12-14得票数 45
回答已采纳
3回答
角形控件禁用绑定不工作
angular、angular-forms
我有一个窗体控件，在加载页面时禁用该控件。当用户单击按钮时，应启用窗体进行编辑。但是，当我切换禁用控件的属性时，什么都不会发生。
模板
<form [formGroup]='accountForm'>
<md-input-container>
<input mdInput formControlName='name' />
</md-input-container>
<button (click)='isEditing = !isEditing'>Edit</b
浏览 1提问于2017-07-31得票数 4
回答已采纳
1回答
禁用控件动态angular2时显示警告消息
angular、disabled-control
我想禁用页面加载中的所有控件，并在用户单击反应性窗体中的add按钮时启用所有控件。为此，我在html模板中使用了[disabled]属性，但是我在控制台中得到了下面的警告消息。
警告：
看起来，您使用的是带有反应性表单的禁用属性。如果在组件类中设置此控件时，将禁用属性设置为true，则禁用属性实际上将在DOM中为您设置。我们建议使用这种方法来避免“检查后更改”错误。
Example:
form = new FormGroup({
first: new FormControl(
{value: 'Nancy', disabled
浏览 2提问于2016-11-17得票数 1
2回答
FormGroup中的禁用控件(窗体自定义窗体控件的一部分)被父级中的.getRawValue()排除在外
angular、angular2-forms、angular-reactive-forms、angular-forms
具有实现ControlValueAccessor的组件，具有内部FormGroup以维护自定义窗体控件的状态。当任何字段(这是FormGroup的一部分)被禁用时，当以父形式调用.getRawValue()方法时，该字段是不可见的。
根据规范，.getRawValue()应该返回原始对象，包括禁用的字段。
我检查了.getRawValue()的代码，下面是我发现的：
getRawValue(): any {
return this._reduceChildren(
{}, (acc: {[k: string]: AbstractControl}, control: A
浏览 1提问于2019-01-13得票数 3
回答已采纳
5回答
如何禁用表单控件但保留值
angular
我有一个反应式。在编辑时，我想禁用一个控件。
以下是工作原理：
this.myForm.controls['analysis_horizon'].disable();
但是，密钥analysis_horizon不再在我的myForm.value散列中。
如何禁用具有反应式表单的字段，但保持表单值的哈希值？
我尝试过disabled=，但得到的结果如下：
It looks like you're using the disabled attribute with a reactive form directive. If you set disabled to tr
浏览 0提问于2017-02-12得票数 43
2回答
角度7设置元件加载上的反应式表单的值启用保存按钮，即使表单未通过验证也是如此
angular、angular6、angular-reactive-forms、angular7
我有以下问题。。
我在构造函数中设置了一个反应式表单：
this.formGroup = this.fb.group({
'family_name_en': new FormControl('', Validators.required),
'family_name_ar': new FormControl('', [Validators.required, Validators.pattern('[\u0600-\u06FF ]*')]),
'unit_id':
浏览 1提问于2018-11-20得票数 4
回答已采纳
7回答
如何禁用FormControls中的所有FormGroup
angular、angular-reactive-forms、formgroups
我有一个反应角形结构：
myForm: FormGroup;
Personal: FormGroup;
FIRST_NAME: FormControl;
LAST_NAME: FormControl;
ngOnInit(): void {
this.createFormControls();
this.createForm();
}
createFormControls() {
this.FIRST_NAME = new FormControl('', [Validators.required]);
this.LAST_NAME = new Fo
浏览 3提问于2017-07-31得票数 29
回答已采纳
3回答
反应性窗体-使用禁用属性时的警告
angular、angular12、angular-reactive-forms
我希望在我的表单中禁用一个选择框，而在从服务器返回此复选框的数据之前，它中没有任何可选择的内容。我需要这样做，因为在选择框中显示的数据取决于在另一个选择框中选择了什么。每当在另一个复选框中选择某项内容时，我需要从服务器加载相应的选项。若要在没有可用数据的情况下禁用复选框，我将使用以下禁用属性：
<mat-select formControlName="formId" [disabled]="formNames.length === 0">
<mat-option
*ngFor="let formName of formNam
浏览 5提问于2022-02-07得票数 1
回答已采纳
11回答
腾讯云上如何自建DNS？
云服务器、DNS 解析 DNSPod、linux、centos、dns
当前腾讯云私有域VPCDNS暂时还不支持背景下，怎么在腾讯云CVM环境下构建内网解析？
实现功能：
1.支持腾讯云云环境保留域名解析如：mirrors.tencentyun.com;
2.支持用户自有业务域名内部网解析如：you.aaa.com；
3.支持访问外网域名解析如：www.qq.com；
4.支持分域名转发到不同的DNS服务器；
基础环境：
CVM：标准型SA2（请根据自身业务情况，选择样本）
操作系统：CentOS Linux版本7.6.1810（核心）
绑定：bind-9.11.4-16.P
浏览 1410提问于2021-01-27
1回答
基于无功角条件的成形控制生成
angular、angular-reactive-forms
我在角度应用中创建了一个反应形式。目前，屏幕左侧显示了一组字段.当用户选择单选按钮时，需要在右边显示另一组类似的字段。
目前，字段的声明是这样的
this.formGroup = this.formBuilder.group({
yesNoMultilingual: [{ value: false, disabled: this.readonly }],
hasDifferentPrincipalAddress: [{ value: null, disabled: this.readonly }, Validators.required],
differentPrincipalAd
浏览 0提问于2021-11-10得票数 0
5回答
更改检测不会在窗体组值更改时触发。
angular、angular-changedetection
我创建了一个简单的例子来演示我面临的一个奇怪的问题。
Stackblitz -
我有三个组成部分，下面是：
1- app组件
import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
import { FormGroup, FormControl } from '@angular/forms';
@Component({
selector: 'my-app',
template: `<hello [form]="form"
浏览 0提问于2018-12-05得票数 16
回答已采纳
1回答
何时何地呼叫updateValueAndValidity？
angular、validation、angular2-form-validation
我不清楚我应该何时何地打电话给updateValueAndValidity.
假设我有一个formGroup，它有很多formControls。现在，基于一些无线电选项选择一个事件触发来修改几个formControls的“验证器”。
Q1:是在修改之后还是在所有修改调用完成之后立即调用updateValueAndValidity？
Q2:我要通过表单更新formGroup / formControls以更新所有的formControls吗？
this.form.updateValueAndValidity('emitEvent': false);
或者单独调用每个formCon
浏览 2提问于2020-12-23得票数 1
回答已采纳
4回答
Angular 2 reactive forms -通过管道从formControlName传送值
angular、angular2-forms
使用Angular 2，我有一个名为"example“的参数，它是一个Date对象。在模板中，我想用日期管道格式化"example“。如下所示：
<input type="text" [value]="example | date:'shortTime'">
// 9:00 AM
但是，我需要使用Angular的反应形式。FormControls优先，所以formControlName将覆盖value指令中的任何内容。
<input type="text" formControlName=
浏览 2提问于2017-03-09得票数 6
1回答
如何以编程方式将属性设置为FormControl？
angular、angular2-forms、angular2-formbuilder
大问题()：基本上，我想要实现的是，将readonly属性应用于FormControl (textbox)，就在以编程方式创建它的时候。
完整场景：I有一个Form，它有一个FormRow，其元素(FormGroups)部分是动态生成的。我还提供了一个选项，可以在单击按钮时追加行。
我希望动态生成的FormGroup的FormControls (textboxes)是readonly，但是手动添加的FormControl应该是可编辑的。
我怎样才能做到这一点？
<div formArrayName="rows">
<div class="row
浏览 4提问于2017-10-07得票数 2
回答已采纳
1回答
如何以基于Angular2模型的形式从API填充下拉列表默认值
angular、typescript、dropdown
我试图在Angular2中创建一个基于模型的表单，其中包括从数据库中提取的几个下拉列表，然后将所选的值绑定到表单。如果表单是从先前保存的表单中编辑的，我也需要能够初始化下拉值。我似乎找不到这方面的任何简单例子，只有将选定的值绑定到一个全新表单的示例。以下是我到目前为止所拥有的：
构成部分：
import { Component, Input, OnInit } from '@angular/core';
import { ActivatedRoute, Params } from '@angular/router';
import { Location } fr
浏览 1提问于2017-03-20得票数 1
回答已采纳
18回答
反应式表单-已禁用属性
angular、typescript
我正在尝试使用formControl中的disabled属性。当我把它放到模板中时，它起作用了：
<md-input formControlName="id" placeholder="ID" [disabled]="true"></md-input>
但是浏览器提醒我：
它看起来像是将disabled属性与reactive form指令一起使用。如果在组件类中设置此控件时将disabled设置为true，则实际上会在DOM中为您设置disabled属性。我们建议使用这种方法来避免“检查后更改”错误。
示例: form =
浏览 69提问于2016-11-09得票数 148
回答已采纳
1回答
Google实时通知SUBSCRIPTION_EXPIRED到期时未收到
android、in-app-purchase、in-app-billing
我正在尝试实现android购买应用程序的后端逻辑，并开始使用进行集成。
在测试过程中，我能够获得SUBSCRIPTION_PURCHASED、SUBSCRIPTION_RENEWED和SUBSCRIPTION_CANCELED，但是当到期时间到来时，我没有看到任何SUBSCRIPTION_EXPIRED。根据文档，SUBSCRIPTION_EXPIRED -一个订阅已经过期，在SUBSCRIPTION_CANCELED之后，用户应该将订阅保持到他/她支付的时间结束为止(即令牌验证响应上的expiryTime )。
一旦订阅被取消，是否应该由我们这边的服务器终止订阅--基于令牌的到期时间信息和
浏览 1提问于2019-02-07得票数 5
2回答
角类型“AbstractControl”缺少“FormGroup”类型中的下列属性：
angular、typescript、angular-material、angular-reactive-forms
我研究的是角FormArray，因此我编写了本教程：，不幸的是，我不能应用本教程。我的HTML部件出错了。
我用角11
这是我的HTML，显示了错误消息：
<div [formGroup]="myForm">
<ng-container formArrayName="demoTypes">
<ng-container *ngFor="let demoForm of demoFormArray.controls">
浏览 5提问于2021-05-03得票数 5
回答已采纳
1回答
角反应性窗体和ControlValueAccessor，窗体值始终为空。
angular、angular-reactive-forms
Hi正在尝试用反应性表单实现ControlValueAccessor，但是我总是收到父组件上表单的空值。我试图在许多地方使用子组件，因此我需要它是可重用的，并且可以添加到父窗体中。
谢谢您的帮助儿童部分
import { ControlValueAccessor, FormBuilder, FormControl, FormGroup, Validators, NG_VALUE_ACCESSOR, NG_VALIDATORS } from '@angular/forms';
import { Component, HostBinding, Input, OnDestro
浏览 5提问于2021-06-28得票数 2
回答已采纳
2回答
角度为5的可观测值的不可解释行为
angular、observable、angular-forms、reactive
下面是可以在上运行的Angular组件的代码
@Component({
selector: 'my-app',
template: `
<div *ngIf="currentNumber$ | async as currentNumber">
<b>{{currentNumber}}</b>
</div>
<form [formGroup]="simpleForm">
<input type="number" formContr
浏览 0提问于2018-02-06得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
