i'm pretty @ wit's end now, trying build application tracks hours timesheets, logic far works calculations seem right hours whatever reason form creating 2 objects when it's submitted , have absolutely 0 idea why.
here's gets outputted console on form submit, data's correct , lines what's in form it's duplicated, , have absolutely no idea why;
day-app.component.ts:44 object {date: "2016-08-08", starttime: "09:00", endtime: "17:30", client: "qwe", project: "qwe"…} day-app.component.ts:44 object {date: "2016-08-08", starttime: "09:00", endtime: "17:30", client: "qwe", project: "qwe"…}
day.ts - object holding data each day logged
export class day { id: number; date: date; starttime: date; endtime: date; hours: number; client: string; project: string; task: string; }
day.service.ts - class used store incoming data
import { injectable } '@angular/core'; import { day } './day'; @injectable() export class dayservice { lastid: number = 0; public days = []; addday(day): void { this.days.push(day); }
day-app.component.ts - component used render views , forms , send form data onto day service storage
import { component } '@angular/core'; import { dayservice } '../day.service'; import { day } '../day'; @component({ moduleid: module.id, selector: 'app-day-app', templateurl: 'day-app.component.html', styleurls: ['day-app.component.css'], providers: [dayservice], }) export class dayappcomponent { constructor(private dayservice: dayservice) { } // can access methods dayservice; // dayservice.method // formservice.method days() { return this.dayservice.getalldays(); } onsubmit(form): void { let formdata = form; let timestotal = (formdata.starttime-formdata.endtime*24); let startdate = new date(date.parse(formdata.date + " " + formdata.starttime)); let enddate = new date(date.parse(formdata.date + " " + formdata.endtime)); let timediff = (((enddate.gettime()-startdate.gettime())/3600)/1000); let newday = { date : formdata.date, starttime : formdata.starttime, endtime : formdata.endtime, client : formdata.client, project : formdata.project, hours : timediff }; console.log(newday); this.dayservice.addday(newday); } }
day-app.component.html
<form #f="ngform" (ngsubmit)="onsubmit(f.value)" class="form"> <div class='input-group'> <div class='row'> <div class='col-sm-12 col-md-12'> <div class='col-sm-6 col-md-6'> <label>date add</label> <input type='date' name='date' placeholder='what date did work?' class='form-control' ngmodel /> <br /> <label>client</label> <input type='text' name='client' placeholder='which client working for?' class='form-control' ngmodel /> <br> </div> <div class='col-sm-6 col-md-6'> <div class='row'> <div class='col-sm-6 col-md-6'> <label>clocked in</label> <input type='time' name='starttime' placeholder='punch in time' class='form-control' ngmodel /> </div> <div class='col-sm-6 col-md-6'> <label>clocked out</label> <input type='time' name='endtime' placeholder='punch out time' class='form-control' ngmodel /> </div> </div> <label>project</label> <input type='text' name='project' placeholder='which project working on?' class='form-control' ngmodel /> </div> </div> <hr /> </div> </div> <br> <input class='btn btn-sm btn-success' autofocus="" type='submit' value='add day' /> </form>
Comments
Post a Comment