如何禁用带有 id 的单选选项按钮并使用角度渲染2

Question

我正在尝试禁用男性单选按钮而不使用 id. 并使用角度渲染2。 但不起作用。 在 html.only 中不更改 form.ts 文件中的更改

形式.html

<label>
<input type="radio"  value="male" formControlName="gender">
<span>male</span>
</label>
<label>
<input  type="radio" value="female" formControlName="gender">
<span>female</span>
</label>
</form>

表单.ts

import { Component, OnInit , Renderer2, ElementRef, ViewChild} from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import * as $ from 'jquery';
@Component({
selector: 'app-reg-form',
templateUrl: './reg-form.component.html',
styleUrls: ['./reg-form.component.css']
})
export class RegFormComponent implements OnInit {
form: FormGroup;
@ViewChild('gender', {static: false}) Input: ElementRef;
constructor(fb: FormBuilder, private renderer: Renderer2) {
this.form = fb.group({
gender: ['male', [Validators.required]]
});
}
ngOnInit() {
this.renderer.setProperty(this.Input, 'disabled', 'true');
}
}

Answer 1

为什么不使用像这样的组件变量禁用

<input type="radio" name="disabled" [attr.disabled]="isDisabled" />

在您的组件中

export class RegFormComponent implements OnInit {
form: FormGroup;
isDisabled: boolean;
@ViewChild('gender', {static: false}) Input: ElementRef;
constructor(fb: FormBuilder, private renderer: Renderer2) {
this.form = fb.group({
gender: ['male', [Validators.required]]
});
}
ngOnInit() {
this.renderer.setProperty(this.Input, 'disabled', 'true');
this.isDisabled = false;
}
}