angularjs – 如何在Angular2中显示和隐藏带有复选框元素的div？

发布时间：2020-12-17 07:12:50 所属栏目：安全来源：网络整理

导读：我有一个复选框,我想要实现的是在选中复选框时隐藏div并显示何时在Angular 2.0 beta中取消选中. 我知道如何使用此代码在角度1.2中执行此操作 label input type="checkbox" ng-model="showhidepregnant"/ Pregnant/labelnbsp;nbsp;nbsp;nbsp;nbsp;nbsp;nbsp;n

我有一个复选框,我想要实现的是在选中复选框时隐藏div并显示何时在Angular 2.0 beta中取消选中.

我知道如何使用此代码在角度1.2中执行此操作

<label>
     <input type="checkbox" ng-model="showhidepregnant"/> Pregnant
</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

div上的代码

<div class="col-md-4 divhidetxtdpatient" ng-hide="showhidemasked">
      <input class="form-control" tabindex="1" id="id_field_specialist" ng-model="id_field_specialist" type="text" ng-blur="savespecialist()" placeholder="maskable"/>
</div>

提前致谢.

解决方法

为您的复选框提供[(ngModel)],并使用* ngIf为div标签使用相同的ngModel.请参阅以下代码示例.

<label>
   <input type="checkbox" [(ngModel)]="showhidepregnant"/> Pregnant
</label>

然后使用相同的模式：

<div class="col-md-4 divhidetxtdpatient" *ngIf="showhidepregnant">

注意：请在.ts文件中声明模型：

showhidepregnant: boolean;

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!