Javascript 基于Angular 6被动形式的单选按钮禁用textarea
我有一个被动表单,它在页面刷新时初始化,并根据与ngModel绑定的单选按钮上的状态禁用/启用,问题是被动表单有另一组单选按钮、星级和文本区域。除文本区域外,所有内容都将根据需要禁用Javascript 基于Angular 6被动形式的单选按钮禁用textarea,javascript,angular,typescript,angular-reactive-forms,Javascript,Angular,Typescript,Angular Reactive Forms,我有一个被动表单,它在页面刷新时初始化,并根据与ngModel绑定的单选按钮上的状态禁用/启用,问题是被动表单有另一组单选按钮、星级和文本区域。除文本区域外,所有内容都将根据需要禁用 <div class="radio-selection"> <p-radioButton name="yes" value="yes" label="Yes" [(ngModel)]="attended" inputId="yes" (ngModelChange)="res
<div class="radio-selection">
<p-radioButton name="yes" value="yes" label="Yes" [(ngModel)]="attended" inputId="yes" (ngModelChange)="resetTextarea()">
</p-radioButton>
<p-radioButton name="no" value="no" label="No" [(ngModel)]="attended" inputId="no" (ngModelChange)="resetForm()">
</p-radioButton>
</div>
<div class="feedback-wrapper">
<textarea pInputTextarea [(ngModel)]="not_attended_reason" [disabled]="attended==='yes'" placeholder="The reason for not attending the traning">
</textarea>
<form [formGroup]="trainingFeedbackForm" *ngIf="feedbackQuestions">
<div formArrayName="feedback">
<ul class="questions">
<li class="list" *ngFor="let question of feedbackQuestions; index as i" [formGroupName]="i">
<div class="ques-title">{{question.text}}</div>
<div class="ques-desc">{{question.description}}</div>
<div *ngIf="question.type === feedbackQuestionTypeRef.Text; else mcq">
<textarea pInputTextarea formControlName="answer" [disabled]="attended==='no'"></textarea>
</div>
<ng-template #mcq>
<p-radioButton *ngFor="let mcq of question.options" name={{question.id}} [disabled]="attended==='no'" label={{mcq.choice}} formControlName="answer" [value]="mcq.choice"></p-radioButton>
</ng-template>
</li>
</ul>
</div>
<div class="training-rating">
<div class="ques-title">Overall Rating</div>
<p-rating [cancel]="false" stars="5" formControlName="rating" [disabled]="attended==='no'"></p-rating>
</div>
</form>
</div>
-
{{问题.文本}
{{问题.说明}
总体评级
现在,启用或禁用表单的单选按钮有:
<p-radioButton name="yes" value="yes" label="Yes" [(ngModel)]="attended" inputId="yes" (ngModelChange)="resetTextarea()">
</p-radioButton>
<p-radioButton name="no" value="no" label="No" [(ngModel)]="attended" inputId="no" (ngModelChange)="resetForm()"></p-radioButton>
它根据需要禁用表单,但不禁用文本区域
有人能帮我做这件事吗
<textarea disabled>
This textarea field is disabled.
</textarea>
HTML
这里是另一个答案,可能对您有所帮助
这解决了是否已签入开发人员检查
已禁用
属性是否应用于textarea元素?此.trainingFeedbackForm.controls['feedback'].disable();此.trainingFeedbackForm.controls['rating'].disable();
import { NgControl } from '@angular/forms';
@Directive({
selector: '[disableControl]'
})
export class DisableControlDirective {
@Input() set disableControl( condition : boolean ) {
const action = condition ? 'disable' : 'enable';
this.ngControl.control[action]();
}
constructor( private ngControl : NgControl ) {
}
}
<input class="form-control" placeholder="Name" name="name" formControlName="name" autocomplete="off" [disableControl]="isDisabled" required>
this.trainingFeedbackForm.controls['feedback'].disable();
this.trainingFeedbackForm.controls['rating'].disable();