Question

我的HTML文件，

  <input type="radio" id="com" name="communication" value="full" (click)= "function(1)">
   <input type="radio" id="com2" name="communication" value="half" (click)= "function(2)">
   <input type="radio" id="com3" name="communication" value="oth" (click)= "function(3)">

  <div id="Flag1" [disabled]="Flag1" [(ngModel)]="Flag1" ngDefaultControl>

  some content....A
  </div>
  <div id="Flag2" [disabled]="Flag2" [(ngModel)]="Flag2" ngDefaultControl>

  some content....B
  </div>
  <div id="Flag3" [disabled]="Flag3" [(ngModel)]="Flag3" ngDefaultControl>

  some content....C
  </div>

我的ts文件：

Flag1=false;
Flag2=false; 
Flag3=false; 
function(x) {
if(x==1){
    alert("inside 1");
  this.Flag1=false;
  this.Flag2=false;
  this.Flag3=false;
}
else if(x==2){
    alert("inside 2");
  this.Flag1=false;
  this.Flag2=false;
  this.Flag3=false;

}
else if(x==3){
    alert("inside 3");
  this.Flag1=true;
  this.Flag2=true;
  this.Flag3=true;
 }
}

如果我单击第一和第二个广播btn，则需要隐藏所有其他div。如果单击第三个btn，则需要显示所有div。但这似乎并不影响我的html页面。有人可以告诉我如何在角度6中做到这一点吗？

Answer 1

使用*ngIf

<div *ngIf="Flag1" id="Flag1" [disabled]="Flag1" [(ngModel)]="Flag1" ngDefaultControl>

  some content....A
</div>

另外，删除disabled和ngModel，我猜这没用。

Answer 2

使用更简单的方法，只需将方括号用于 'value' 属性，如下所示

  <input type="radio"  name="AdInterest" [(ngModel)]="isAdInterest" [value]="true" >

  <input type="radio"  name="AdInterest"[(ngModel)]="isAdInterest" [value]="false" >
and

'

...' 检查一下

如何基于角度6中的单选按钮显示/隐藏div？

2 个答案: