Javascript 当使用angular2选中复选框时，如何获取该特定部分的数据_Javascript_Angular_Typescript

Javascript 当使用angular2选中复选框时，如何获取该特定部分的数据

javascript angular typescript

Javascript 当使用angular2选中复选框时，如何获取该特定部分的数据,javascript,angular,typescript,Javascript,Angular,Typescript,我有所有部分的复选框，如果我点击其中一个复选框并点击提交按钮，我必须在控制台部分获得该部分的详细信息。有人能帮我修一下吗 **Stackblitz link:** : HTML: 用户检查所需项目后，使用输入change事件添加数据将change事件添加到输入中。e、 g: <input class="pull-right top-4" type="checkbox" value="allergy" (change)="updateData($event)">

我有所有部分的复选框，如果我点击其中一个复选框并点击提交按钮，我必须在控制台部分获得该部分的详细信息。有人能帮我修一下吗

**Stackblitz link:** :

HTML:

用户检查所需项目后，使用输入

change

事件添加数据

将

change

事件添加到输入中。e、 g:

<input class="pull-right top-4" type="checkbox" value="allergy" 
       (change)="updateData($event)">

您的

updateData

函数应处理输入更改事件：

updateData($event) {
  if ($event.checked) { 
    // your logic when user checks the checkbox
    const section = $event.target.value; // the value you set to the checkbox
    this.data.push(this[section]);
  } else { 
    // your logic when user unchecks the checkbox
    console.log('Your logic when user unchecks, you probably want to remove the                         
    item from the array');  
  }
}

用户检查所需项目后，使用输入

change

事件添加数据

将

change

事件添加到输入中。e、 g:

<input class="pull-right top-4" type="checkbox" value="allergy" 
       (change)="updateData($event)">

您的

updateData

函数应处理输入更改事件：

updateData($event) {
  if ($event.checked) { 
    // your logic when user checks the checkbox
    const section = $event.target.value; // the value you set to the checkbox
    this.data.push(this[section]);
  } else { 
    // your logic when user unchecks the checkbox
    console.log('Your logic when user unchecks, you probably want to remove the                         
    item from the array');  
  }
}

首先，我注意到您有多个id属性具有相同的值，id应该是唯一的

Html:

<div class="tabcontent hide emr_records" id="EMR_RecordsList" style="display: block;">
    <h6 class="col-12 emr_header">Allergy
        <input class="pull-right top-4" type="checkbox" #allergyViewChild>
    </h6>
    <div class="row bg-white m-0 p-t10 brd-blu" id="record_allergy" *ngFor="let data of allergy">
        <div class="col-sm-6">
            <label class="col-sm-4">Criticality :</label>
            <label class="col-sm-7">{{data.Criticality}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Patient :</label>
            <label class="col-sm-7">{{data.Patient}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Substance :</label>
            <label class="col-sm-7">{{data.Substance}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Reaction :</label>
            <label class="col-sm-7">{{data.Reaction}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Onset :</label>
            <label class="col-sm-7">{{data.Onset}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Recorder :</label>
            <label class="col-sm-7">{{data.Recorder}}</label>
        </div>
    </div>
    <!-- Care Plan -->
    <h6 class="col-12 emr_header m-t10">CarePlan
        <input class="pull-right top-4" type="checkbox" #CarePlanViewChild>
    </h6>
    <div class="row bg-white m-0 p-t10 brd-blu" id="record_CarePlan" *ngFor="let data of CarePlan">
        <div class="col-sm-6">
            <label class="col-sm-4">Addresses :</label>
            <label class="col-sm-7">{{data.Addresses}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Status :</label>
            <label class="col-sm-7">{{data.Status}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Category :</label>
            <label class="col-sm-7">{{data.Category}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Prohibited :</label>
            <label class="col-sm-7">{{data.Prohibited}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Goal :</label>
            <label class="col-sm-7">{{data.Goal}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">code :</label>
            <label class="col-sm-7">{{data.code}}</label>
        </div>
    </div>
  <!-- Condition -->
  <h6 class="col-12 emr_header m-t10">Condition
    <input class="pull-right top-4" type="checkbox" #ConditionViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Condition" *ngFor = "let data of Condition">
      <div class="col-sm-6">
          <label class="col-sm-4">ClinicalStatus :</label>
          <label class="col-sm-7">{{data.ClinicalStatus}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">VerificationStatus :</label>
          <label class="col-sm-6">{{data.VerificationStatus}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Asserter :</label>
          <label class="col-sm-7">{{data.Asserter}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Code :</label>
          <label class="col-sm-7">{{data.Code}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">category :</label>
          <label class="col-sm-7">{{data.category}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Severity :</label>
          <label class="col-sm-6">{{data.Severity}}</label>
      </div>
  </div>
  <!-- Device -->
  <h6 class="col-12 emr_header m-t10">Device
      <input class="pull-right top-4" type="checkbox" #deviceViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Device" *ngFor = "let data of device">
      <div class="col-sm-6">
          <label class="col-sm-4">Udi :</label>
          <label class="col-sm-7">{{data.Udi}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Status :</label>
          <label class="col-sm-6">{{data.Status}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Model :</label>
          <label class="col-sm-7">{{data.Model}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">ExpirationDate :</label>
          <label class="col-sm-6">{{data.ExpirationDate}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Patient :</label>
          <label class="col-sm-7">{{data.Patient}}</label>
      </div>
  </div>
  <!-- Immunization -->
  <h6 class="col-12 emr_header m-t10">Immunization
      <input class="pull-right top-4" type="checkbox" #immunizationViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Immunization" *ngFor = "let data of immunization">
      <div class="col-sm-6">
          <label class="col-sm-5">Status :</label>
          <label class="col-sm-6">{{data.Status}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">WasNotGiven :</label>
          <label class="col-sm-7">{{data.WasNotGiven}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">VaccineCode :</label>
          <label class="col-sm-6">{{data.VaccineCode}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">&nbsp;LotNumber :</label>
          <label class="col-sm-7">{{data.LotNumber}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">&nbsp;Date :</label>
          <label class="col-sm-6">{{data.Date}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Patient :</label>
          <label class="col-sm-7">{{data.Patient}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Route :</label>
          <label class="col-sm-6">{{data.Route}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Site :</label>
          <label class="col-sm-7">{{data.Site}}</label>
      </div>
  </div>
  <!-- Save and Cancel Button -->
  <div class="col-12 m-t20 m-b20 text-right">
      <a class="share" (click)="exportEmr()">Export to EMR</a>
      <a class="reset">Cancel</a>
  </div>

首先，我注意到您有多个id属性，具有相同的值，id应该是唯一的

Html:

<div class="tabcontent hide emr_records" id="EMR_RecordsList" style="display: block;">
    <h6 class="col-12 emr_header">Allergy
        <input class="pull-right top-4" type="checkbox" #allergyViewChild>
    </h6>
    <div class="row bg-white m-0 p-t10 brd-blu" id="record_allergy" *ngFor="let data of allergy">
        <div class="col-sm-6">
            <label class="col-sm-4">Criticality :</label>
            <label class="col-sm-7">{{data.Criticality}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Patient :</label>
            <label class="col-sm-7">{{data.Patient}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Substance :</label>
            <label class="col-sm-7">{{data.Substance}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Reaction :</label>
            <label class="col-sm-7">{{data.Reaction}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Onset :</label>
            <label class="col-sm-7">{{data.Onset}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Recorder :</label>
            <label class="col-sm-7">{{data.Recorder}}</label>
        </div>
    </div>
    <!-- Care Plan -->
    <h6 class="col-12 emr_header m-t10">CarePlan
        <input class="pull-right top-4" type="checkbox" #CarePlanViewChild>
    </h6>
    <div class="row bg-white m-0 p-t10 brd-blu" id="record_CarePlan" *ngFor="let data of CarePlan">
        <div class="col-sm-6">
            <label class="col-sm-4">Addresses :</label>
            <label class="col-sm-7">{{data.Addresses}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Status :</label>
            <label class="col-sm-7">{{data.Status}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Category :</label>
            <label class="col-sm-7">{{data.Category}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Prohibited :</label>
            <label class="col-sm-7">{{data.Prohibited}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Goal :</label>
            <label class="col-sm-7">{{data.Goal}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">code :</label>
            <label class="col-sm-7">{{data.code}}</label>
        </div>
    </div>
  <!-- Condition -->
  <h6 class="col-12 emr_header m-t10">Condition
    <input class="pull-right top-4" type="checkbox" #ConditionViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Condition" *ngFor = "let data of Condition">
      <div class="col-sm-6">
          <label class="col-sm-4">ClinicalStatus :</label>
          <label class="col-sm-7">{{data.ClinicalStatus}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">VerificationStatus :</label>
          <label class="col-sm-6">{{data.VerificationStatus}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Asserter :</label>
          <label class="col-sm-7">{{data.Asserter}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Code :</label>
          <label class="col-sm-7">{{data.Code}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">category :</label>
          <label class="col-sm-7">{{data.category}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Severity :</label>
          <label class="col-sm-6">{{data.Severity}}</label>
      </div>
  </div>
  <!-- Device -->
  <h6 class="col-12 emr_header m-t10">Device
      <input class="pull-right top-4" type="checkbox" #deviceViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Device" *ngFor = "let data of device">
      <div class="col-sm-6">
          <label class="col-sm-4">Udi :</label>
          <label class="col-sm-7">{{data.Udi}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Status :</label>
          <label class="col-sm-6">{{data.Status}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Model :</label>
          <label class="col-sm-7">{{data.Model}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">ExpirationDate :</label>
          <label class="col-sm-6">{{data.ExpirationDate}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Patient :</label>
          <label class="col-sm-7">{{data.Patient}}</label>
      </div>
  </div>
  <!-- Immunization -->
  <h6 class="col-12 emr_header m-t10">Immunization
      <input class="pull-right top-4" type="checkbox" #immunizationViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Immunization" *ngFor = "let data of immunization">
      <div class="col-sm-6">
          <label class="col-sm-5">Status :</label>
          <label class="col-sm-6">{{data.Status}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">WasNotGiven :</label>
          <label class="col-sm-7">{{data.WasNotGiven}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">VaccineCode :</label>
          <label class="col-sm-6">{{data.VaccineCode}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">&nbsp;LotNumber :</label>
          <label class="col-sm-7">{{data.LotNumber}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">&nbsp;Date :</label>
          <label class="col-sm-6">{{data.Date}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Patient :</label>
          <label class="col-sm-7">{{data.Patient}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Route :</label>
          <label class="col-sm-6">{{data.Route}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Site :</label>
          <label class="col-sm-7">{{data.Site}}</label>
      </div>
  </div>
  <!-- Save and Cancel Button -->
  <div class="col-12 m-t20 m-b20 text-right">
      <a class="share" (click)="exportEmr()">Export to EMR</a>
      <a class="reset">Cancel</a>
  </div>

Bhrungarajni，以“角度风格”完成任务

//声明一个检查数组
检查：布尔值[]=[]
//在.html中使用ngModel
过敏
...
护理计划
....
//正在使用stread运算符
让结果：任意{}
如果（勾选[0]）
结果=这是过敏反应；
如果（勾选[1]）
结果={…结果，this.careplan}
...

顺便说一句，你可以尝试在一个独特的数组中定义你的变量

//声明一个检查数组
检查：布尔值[]=[]
//在.html中使用ngModel
过敏
...
护理计划
....
//正在使用stread运算符
让结果：任意{}
如果（勾选[0]）
结果=这是过敏反应；
如果（勾选[1]）
结果={…结果，this.careplan}
...

顺便说一句，您可以尝试在唯一数组中定义变量

感谢您的响应，但是在这里，如果（document.getElementById（“allergy”）.checked）{console.log（this.allergy）；}属性“checked”在类型“HTMLElement”上不存在，我将面临.checked的错误。很好，只需单击按钮，即可在控制台中显示值。我认为这个错误只在stackblitz中显示出来。代码无论如何都可以工作不，不，这个错误在我的localhost oly中，我无法编译，因为这个错误谢谢你，我也尝试过同样的方法。谢谢你的响应，但是我在这里遇到了错误。checked if（document.getElementById（“allergy”）.checked）{console.log（this.allergy）；}属性“checked”在类型“HtmleElement”上不存在。很好，只需单击按钮，即可在控制台中显示值。我认为这个错误只在stackblitz中显示出来。代码无论如何都可以工作不，不，这个错误在我的localhost oly中，由于这个错误我无法编译谢谢，我也尝试过同样的方法。

<div class="tabcontent hide emr_records" id="EMR_RecordsList" style="display: block;">
    <h6 class="col-12 emr_header">Allergy
        <input class="pull-right top-4" type="checkbox" #allergyViewChild>
    </h6>
    <div class="row bg-white m-0 p-t10 brd-blu" id="record_allergy" *ngFor="let data of allergy">
        <div class="col-sm-6">
            <label class="col-sm-4">Criticality :</label>
            <label class="col-sm-7">{{data.Criticality}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Patient :</label>
            <label class="col-sm-7">{{data.Patient}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Substance :</label>
            <label class="col-sm-7">{{data.Substance}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Reaction :</label>
            <label class="col-sm-7">{{data.Reaction}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Onset :</label>
            <label class="col-sm-7">{{data.Onset}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Recorder :</label>
            <label class="col-sm-7">{{data.Recorder}}</label>
        </div>
    </div>
    <!-- Care Plan -->
    <h6 class="col-12 emr_header m-t10">CarePlan
        <input class="pull-right top-4" type="checkbox" #CarePlanViewChild>
    </h6>
    <div class="row bg-white m-0 p-t10 brd-blu" id="record_CarePlan" *ngFor="let data of CarePlan">
        <div class="col-sm-6">
            <label class="col-sm-4">Addresses :</label>
            <label class="col-sm-7">{{data.Addresses}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Status :</label>
            <label class="col-sm-7">{{data.Status}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Category :</label>
            <label class="col-sm-7">{{data.Category}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Prohibited :</label>
            <label class="col-sm-7">{{data.Prohibited}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">Goal :</label>
            <label class="col-sm-7">{{data.Goal}}</label>
        </div>
        <div class="col-sm-6">
            <label class="col-sm-4">code :</label>
            <label class="col-sm-7">{{data.code}}</label>
        </div>
    </div>
  <!-- Condition -->
  <h6 class="col-12 emr_header m-t10">Condition
    <input class="pull-right top-4" type="checkbox" #ConditionViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Condition" *ngFor = "let data of Condition">
      <div class="col-sm-6">
          <label class="col-sm-4">ClinicalStatus :</label>
          <label class="col-sm-7">{{data.ClinicalStatus}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">VerificationStatus :</label>
          <label class="col-sm-6">{{data.VerificationStatus}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Asserter :</label>
          <label class="col-sm-7">{{data.Asserter}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Code :</label>
          <label class="col-sm-7">{{data.Code}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">category :</label>
          <label class="col-sm-7">{{data.category}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Severity :</label>
          <label class="col-sm-6">{{data.Severity}}</label>
      </div>
  </div>
  <!-- Device -->
  <h6 class="col-12 emr_header m-t10">Device
      <input class="pull-right top-4" type="checkbox" #deviceViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Device" *ngFor = "let data of device">
      <div class="col-sm-6">
          <label class="col-sm-4">Udi :</label>
          <label class="col-sm-7">{{data.Udi}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Status :</label>
          <label class="col-sm-6">{{data.Status}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Model :</label>
          <label class="col-sm-7">{{data.Model}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">ExpirationDate :</label>
          <label class="col-sm-6">{{data.ExpirationDate}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Patient :</label>
          <label class="col-sm-7">{{data.Patient}}</label>
      </div>
  </div>
  <!-- Immunization -->
  <h6 class="col-12 emr_header m-t10">Immunization
      <input class="pull-right top-4" type="checkbox" #immunizationViewChild>
  </h6>
  <div class="row bg-white m-0 p-t10 brd-blu" id="record_Immunization" *ngFor = "let data of immunization">
      <div class="col-sm-6">
          <label class="col-sm-5">Status :</label>
          <label class="col-sm-6">{{data.Status}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">WasNotGiven :</label>
          <label class="col-sm-7">{{data.WasNotGiven}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">VaccineCode :</label>
          <label class="col-sm-6">{{data.VaccineCode}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">&nbsp;LotNumber :</label>
          <label class="col-sm-7">{{data.LotNumber}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">&nbsp;Date :</label>
          <label class="col-sm-6">{{data.Date}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Patient :</label>
          <label class="col-sm-7">{{data.Patient}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-5">Route :</label>
          <label class="col-sm-6">{{data.Route}}</label>
      </div>
      <div class="col-sm-6">
          <label class="col-sm-4">Site :</label>
          <label class="col-sm-7">{{data.Site}}</label>
      </div>
  </div>
  <!-- Save and Cancel Button -->
  <div class="col-12 m-t20 m-b20 text-right">
      <a class="share" (click)="exportEmr()">Export to EMR</a>
      <a class="reset">Cancel</a>
  </div>

  export class AppComponent  {
      @ViewChild('allergyViewChild') allergyViewChild: ElementRef;
      @ViewChild('CarePlanViewChild') CarePlanViewChild: ElementRef;
      @ViewChild('ConditionViewChild') ConditionViewChild: ElementRef;
      @ViewChild('deviceViewChild') deviceViewChild: ElementRef;
      @ViewChild('immunizationViewChild') immunizationViewChild: ElementRef;
      public msgs: any[] = [];
      allergy:any;
      CarePlan:any;
      Condition:any;
      device:any;
      immunization:any;

      constructor() { }

      ngOnInit() {
          this.allergy = [{"Criticality":"CRITL","Patient":"Jason Argonaut","Substance":"PENICILLIN G","Reaction":"Confirmed","Onset":"2012-11-07T00:00:00Z","Recorder":"MOORE, SEAN"}]
          this.CarePlan = [{"Addresses":"CRITL","Status":"active","Category":"other","Prohibited":"FALSE","Goal":"Hemoglobin A1c","code":"CBC AND DIFFERENTIAL"}]
          this.Condition = [{"ClinicalStatus":"Active","VerificationStatus":"Confirmed","Asserter":"MOORE, SEAN","Code":"","category":"","Severity":"Medium"}]
          this.device = [{"Udi":"(17)170324(21)455884315749","Status":"Available","Model":"G754-B","ExpirationDate":"2017-03-24T00:00:00Z","Patient":"Jason Argonaut"}]
          this.immunization = [{"Status":"Completed","WasNotGiven":"FALSE","VaccineCode":"DTP-Hib-Hep B","LotNumber":"12321","Date":"2016-01-09T00:00:00Z","Patient":"Jason Argonaut","Route":"Intravenous","Site":"Left arm"}]
      }

      exportEmr() {
          if(this.allergyViewChild.nativeElement.checked){
              console.log(this.allergy);
          }
          if(this.CarePlanViewChild.nativeElement.checked){
              console.log(this.CarePlan);
          }
          if(this.ConditionViewChild.nativeElement.checked){
              console.log(this.Condition);
          }
          if(this.deviceViewChild.nativeElement.checked){
              console.log(this.device);
          }
          if(this.immunizationViewChild.nativeElement.checked){
              console.log(this.immunization);
          }
      }
}

//declare an array of checks
checks:boolean[]=[]

//use ngModel in your .html
<h6 class="col-12 emr_header">Allergy
        <input ([NgModel)]="check[0]" class="pull-right top-4" type="checkbox" #allergyViewChild>
    </h6>
    ...
<h6 class="col-12 emr_header">Careplan
        <input ([NgModel)]="check[1]" class="pull-right top-4" type="checkbox" #careplanViewChild>
    </h6>
    ....

//In submit use stread operator
let result:any{}
if (check[0])
   result=this.allergy;
if (check[1])
   result={...result,this.careplan}
...