No estoy seguro de la forma correcta de vincular y actualizar un modelo donde las casillas de verificación se generan dinámicamente. (Este es un proyecto ASP.NET Core con Angular 2 creado inicialmente usando el generador Yeoman) O una simple casilla de verificación para el caso que acabo de descubrir.

A continuación se muestra el código despojado, que tiene una instalación y intervalos de tiempo. Cada instalación puede tener múltiples intervalos de tiempo. La lista de casillas de verificación del intervalo de tiempo se muestra bien. Los datos iniciales indican que solo se debe verificar un intervalo de tiempo. Pero cuando cargo una instalación, se verifican todos los intervalos de tiempo. No son vinculantes con ngModel como esperaba.

¿Cómo lo soluciono para que solo se verifiquen los intervalos de tiempo incluidos en los datos de la instalación en lugar de todos?¿Cómo vinculo lo que está marcado a la propiedad ngModel timeslotids? ¿Necesito crear una propiedad de matriz en el componente y manipularla en lugar de confiar en ngModel? (probé esto pero obviamente no lo hice bien, así que volví al código a continuación)También parece estar teniendo un problema relacionado con una casilla de verificación simple (haselectric) porque esto tampoco está marcando cuándo debería ser. ¿Me estoy perdiendo una importación que solucionaría todo esto?

EXPLICACIÓN DEL CÓDIGO Tengo dos objetos (facilidad y intervalo de tiempo) que provienen de una API que uno a las interfaces. Se han reducido significativamente en propiedades por simplicidad:

export interface IFacility {   
   id: number,
   name: string,
   haselectric: boolean, 
   timeslotids: number[],    
   timeslots: ITimeslot[]

}
export interface ITimeslot {
    id: number,
    timeslotname: string    
}

Estos son los datos JSON para Timeslots:

[{"id":1,"timeslotname":"Daily"},{"id":2,"timeslotname":"Hourly"},{"id":4,"timeslotname":"Market"}]

Estos son los datos JSON para una sola Instalación antes de ser actualizados:

{"id":2,"name":"Clements Building","haselectric":true,"timeslotids":[1],"timeslots":[{"id":1,"timeslotname":"Daily"}]}

Componente para editar una instalación (facilities.component.html):

<form #form="ngForm" (ngSubmit)="submitForm()" *ngIf="formactive">
   <input type="hidden" [(ngModel)]="updatedfacility.id" #id="ngModel" name="id" />
    <div class="form-group">
         <label for="name">Facility Name *</label>
         <input type="text" class="form-control input-lg" [(ngModel)]="updatedfacility.name" #name="ngModel" name="name" placeholder="Facility Name *">
   </div>
   <div class="form-group">
                    <label for="exhibitspaces">Has Electric *</label>
                    <input type="checkbox" class="form-control input-lg" [(ngModel)]="updatedfacility.haselecric" #haselectric="ngModel" name="haselectric">
    </div>
    <div class="form-group">
        <label for="timeslots">Select Timeslots Available for Rent *</label>
        <div *ngIf="dbtimeslots" >
            <span *ngFor="let timeslot of dbtimeslots" class="checkbox">
                <label for="timeslot">
                    <input type="checkbox" [(ngModel)]="updatedfacility.timeslotids" value="{{timeslot.id}}" name="{{timeslot.id}}" [checked]="updatedfacility.timeslotids.indexOf(timeslot.id)" />{{timeslot.timeslotname}}
                 </label>
             </span>
        </div>
    </div>
    <button type="submit" class="btn btn-lg btn-default" [disabled]="form.invalid">Update</button> 
</form>

Código para el componente (facilities.component.ts)

import { Component, OnInit, Input, Output, OnChanges, EventEmitter  } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { ActivatedRoute, Router } from '@angular/router'; 
import { FormsModule }  from '@angular/forms';
import { FacilityService }  from '../../../services/facility.service';
import { TimeslotService } from '../../../services/timeslot.service';
import { IFacility } from '../../../services/facility.interface';
import { ITimeslot } from '../../../services/timeslot.interface';

@Component({
   template: require('./facility.component.html')
})
export class FacilityDetailsComponent {
  facility: IFacility;
  httpresponse: string;
  successMessage: string;
  errormessage: string;
  showSuccess: boolean = true;
  showError: boolean = true;
  formactive: boolean = true;
  dbtimeslots: ITimeslot[];    


  constructor(
    private _route: ActivatedRoute,
    private _router: Router,
    private _facilityservice: FacilityService,
    private _timeslotservice: TimeslotService
  ) {}

  ngOnInit(): void {
    this._timeslotservice.getTimeslots().subscribe(timeslots => this.dbtimeslots = timeslots, error => this.errormessage = <any>error);
    let id = +this._route.snapshot.params['id'];

    this._facilityservice.getFacility(id)
        .subscribe(facility => this.facility = facility,
        error => this.errormessage = <any>error);

  }

  submitForm() {
    //update the facility through the service call
    this._facilityservice.updateFacility(this.facility)
        .subscribe(response => {
            this.httpresponse = response;
            console.log(this.httpresponse);
            this.successMessage = "Facility updated!";
            this.formactive = false;
            setTimeout(() => this.formactive = true, 3);
            this.showSuccess = false;
        },
        error => {
            this.errormessage = <any>error;
            this.showError = false;
        });
  }     

}

PD La razón por la que tengo dos propiedades en el objeto de instalación para los intervalos de tiempo es porque una lista de ID es mucho más fácil de pasar a la API para su actualización. En lugar de pasar modelos completos (los intervalos de tiempo son más grandes que los que tengo aquí y no son necesarios para actualizar la base de datos). Reserve comentarios al respecto, ya que no está relacionado con lo que debe lograrse.

Encontré esta pregunta ... pero lamentablemente, nadie respondió a este pobre tipo:Enlace ngmodel con matriz dinámica de casilla de verificación en angular2 Intenté esto pero no funcionó:Obtener valores de una lista de casilla de verificación dinámica También probé la versión de actualizar una propiedad local en (cambio) de la casilla de verificación, pero tampoco pareció funcionar:Angular 2: Obtenga valores de múltiples casillas marcadas