简体   繁体   中英

Angular- ng model cannot get the object array value

have check in and out two dynamic input field. when select the days will let user field in the check in and out time range. The problems are the value and data format cannot get it. The ng model cannot the check in and check out value. I want to save the data format like this into the database.

{
  "days": {
    "Monday": {
      "checkin": "09:00",
      "checkout": "18:00"
    },
    "Tuesday": {
      "checkin": "07:00",
      "checkout": "19:00"
    }
  }
}

Here is my html file

<div class="row">
        <div class="col-lg-12">
          <div class="form-group">
            <label>Active Days</label>
            <ng-select [items]="days" name="days"
             bindLabel="id" autofocus loadingText="Loading ..." [multiple]=true
              bindValue="id"  placeholder="Select Active Days" 
              [(ngModel)]="attendanceProfile.daysprofile.dayy" >
            </ng-select>
          </div>
        </div>
      </div>
     
      <div *ngFor="let days of attendanceProfile.daysprofile.dayy; let i =index ">
        <div class="row">

          <div class="col-md-4">
            <div class="form-group">
              <label>Day</label>
              <input autocomplete="off" atp-time-picker type="text" 
                class="form-control" name="days" id="days"
                [value]="days"
                placeholder="days"  disabled />
            </div>
          </div>

          <div class="col-md-4">
            <div class="form-group">
              <label>Check In Time</label>
              <input autocomplete="off" atp-time-picker type="text" 
              class="form-control" name="checkin" id="checkin"
                [(ngModel)]="attendanceProfile.daysprofile.dayy[i].checkin" placeholder="chcekin" />
            </div>
          </div>

          <div class="col-md-4">
            <div class="form-group">
              <label>Check Out Time</label>
              <input autocomplete="off" type="text" 
               class="form-control" name="checkout" id="checkout"
                [(ngModel)]="attendanceProfile.daysprofile.dayy[i].checkout" placeholder="checkout" />
            </div>
          </div>

        </div>
      </div>

Here is my component code. try to save it by using the attendanceprofile object.

getNewObject(updateDefault: boolean = false): AttendanceProfile {
    let attendanceProfile = new AttendanceProfile();
    attendanceProfile.updatedAt = new Date();
    attendanceProfile.updatedBy = this.configService.currentUser.fullname;
    attendanceProfile.status = 0;
    attendanceProfile.daysprofile= {
        dayy:{['']:{checkin:{},checkout:{}}}
    }
    

[i].checkin cannot get the value. try use checkin[i] to get the value.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM