Componet.ts
import .....;
export class SalesComponent implements OnInit {
salesForm: FormGroup;
constructor ( private formBuild: FormBuilder) {}
ngOnInit() {
this.salesForm = this.formBuild.group({
type : new FormControl(),
person : new FormControl()
});
}
}HTML
<form novalidate [formGroup]="salesForm">
<div class="row">
<div class="col-md-4">
<div class="form-group">
<label>MOBILE PHONES</label>
<div class="radio">
<label><input type="radio" formControlName="type" name="type" value="LG">LG</label>
<label><input type="radio" formControlName="type" name="type" value="HTC">HTC</label>
</div>
<legend>PEOPLE</legend>
<div class="checkbox">
<label><input type="checkbox" formControlName="person" value="JAMES">JAMES</label>
<label><input type="checkbox" formControlName="person" value="JOHN">JOHN</label>
</div>
</div>
</div>
<div class="col-md-4">
<div *ngIf=" type == 'HTC' " class="form-group">
<h1>HTC RESULT PHONES</h1>
</div>
<div *ngIf=" person == 'JAMES' " class="form-group">
<h1>JAMES RESULT</h1>
</div>
</div>
</div>
</form>基本上
LG时,我想显示HTC结果手机JAMES时,我想显示JAMES内容我正在使用template driven表单。如果这有区别的话,请参阅plnkr不起作用
发布于 2018-03-23 12:55:25
您应该获得表单值,现在您正在检查组件属性。
<div *ngIf=" salesForm.get('type').value === 'HTC' " class="form-group">
<h1>HTC RESULT PHONES</h1>
</div>
<div *ngIf=" salesForm.get('person').value === 'JAMES' " class="form-group">
<h1>JAMES RESULT</h1>
</div>发布于 2018-03-23 12:50:58
在检查字符串时应使用===,该字符串也将检查类型
<div *ngIf=" type === 'HTC' " class="form-group">https://stackoverflow.com/questions/49450068
复制相似问题