基于 Angular 中的单选按钮禁用输入字段 2

Question

假设我有这些单选按钮，我创建了一个点击函数 localClick，对于第一个按钮，它应该有 1，第二个给定值 2

<div class="ui-g-12"><p-radioButton name="group1" value="Local" (click)=localClick(1) label="Local"></p-radioButton></div>
<div class="ui-g-12"><p-radioButton name="group1" value="Remote" label="Remote" (click)=localClick(2) ></p-radioButton></div>

现在我想要我的输入字段

Example

 <input id="pass" type="text" style="width:80%" disabled="exampleFlag" pInputText [(ngModel)]="password">

我在谷歌上搜索了一下并添加了这个东西，disabled=exampleFlag，现在在 ts 文件中，我根据单击的单选按钮将其设置为 true 或 false，所以我这样做了

exampleFlag=false; // set it to false initially so box is not disabled
localClick(x) {
if(x==1){
  this.exampleFlag=true;
}
else{
  this.exampleFlag=false;
}
}

基本上我在这里做的是，如果点击第一个单选按钮然后将其设置为真（这样该框将被禁用）但是否则无论没有选择按钮还是第二个单选按钮是否被选中都应该启用已选中。

我是新手，但我用谷歌搜索了一下，想出了这样的解决方案，但对我来说，无论我做什么，盒子总是保持禁用状态。

我认为我犯的错误是在 html 文件中定义（点击）东西的方式，也许也在 ts 文件中，但我不确定。

Answer 1

将 disabled 括在方括号中以将其绑定到属性值。

<input id="pass" type="text" style="width:80%" [disabled]="exampleFlag" pInputText [(ngModel)]="password">

基于 Angular 中的单选按钮禁用输入字段 2

Disabling input field based on radio button in Angular 2

html

javascript

typescript

angular2-template

angular