import { Component } from '@angular/core';
import { FormBuilder, Validators } from '@angular/forms';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
title = 'app';
userForm: any;
constructor(private formBuilder: FormBuilder) {
this.userForm = this.formBuilder.group({
'Firstname':[{ value: '', disabled: false }],
'Lastname':[{ value: '', disabled: false }],
'Zipcode':[{ value: '', disabled: false }],
})
<form [formGroup]="userForm" >
<label for="name">Name</label>
<input formControlName="FirstName" (change)="toogle()" />
<label for="email">Email</label>
<input formControlName="Lastname" />
<label for="profile">Profile Description</label>
<textarea formControlName="Zipcode"></textarea>
<button type="submit" >Submit</button>
</form>
当用户在Firstname文本框中输入值时,应禁用其他文本框 当用户输入lastname ..firstname并且zipcode应该被删除 当用户在zipcode中输入值时,应该禁用第一个名称和姓氏
答案 0 :(得分:1)
您唯一需要做的就是将代码中的内容直接应用到我们这里。
当用户在Firstname文本框中输入值时,应禁用其他文本框
this.userForm.get('FirstName').valueChanges
.filter(x => x != null && x != '')
.subscribe(() => {
this.userForm.get('LastName').disable()
this.userForm.get('Zipcode').disable()
})
你可以用类似的方式完成剩下的工作。并且不要忘记取消订阅。