Skip to content

Commit

Permalink
Date Format Right
Browse files Browse the repository at this point in the history
harshbaldwa committed Sep 30, 2019
1 parent 3f1c525 commit a8c8802
Showing 4 changed files with 62 additions and 9 deletions.
13 changes: 13 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

6 changes: 4 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -19,6 +19,7 @@
"@angular/core": "~8.0.0",
"@angular/forms": "~8.0.0",
"@angular/material": "^8.0.0",
"@angular/material-moment-adapter": "^8.2.1",
"@angular/platform-browser": "~8.0.0",
"@angular/platform-browser-dynamic": "~8.0.0",
"@angular/pwa": "^0.803.6",
@@ -32,13 +33,14 @@
"hammerjs": "^2.0.8",
"jsonwebtoken": "^8.5.1",
"lodash": "^4.17.15",
"moment": "^2.24.0",
"mongoose": "^5.6.9",
"mongoose-unique-validator": "^2.0.3",
"ngx-push-notifications": "^7.0.2",
"rxjs": "~6.4.0",
"tslib": "^1.9.0",
"zone.js": "~0.9.1",
"webpack-cli": "^3.1.0"
"webpack-cli": "^3.1.0",
"zone.js": "~0.9.1"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.800.0",
7 changes: 3 additions & 4 deletions src/app/challenge-new/challenge-new.component.html
Original file line number Diff line number Diff line change
@@ -9,10 +9,9 @@ <h1 class='mat-heading'>New Challenge - {{name}}</h1>
<input matInput type="text" placeholder="Message" ngModel name="message" #message="ngModel" required>
</mat-form-field><br>
<mat-form-field>
<input matInput [min]="minDate" readonly="true" [matDatepicker]="picker" placeholder="Choose a date" name="date"
ngModel #date="ngModel" required>
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker touchUi #picker></mat-datepicker>
<input matInput [min]="minDate" [matDatepicker]="dp" readonly="true" placeholder="Date" [formControl]="date">
<mat-datepicker-toggle matSuffix [for]="dp"></mat-datepicker-toggle>
<mat-datepicker #dp></mat-datepicker>
</mat-form-field><br>
<mat-form-field>
<input matInput atp-time-picker readonly="true" placeholder="Time" name="time" ngModel #time="ngModel" required
45 changes: 42 additions & 3 deletions src/app/challenge-new/challenge-new.component.ts
Original file line number Diff line number Diff line change
@@ -1,16 +1,42 @@
import { Component, OnInit, OnDestroy } from '@angular/core';
import { ActivatedRoute, ParamMap, Router } from '@angular/router';
import { NgForm } from '@angular/forms';
import { NgForm, FormControl } from '@angular/forms';
import { LadderService } from '../app.service';
import { MomentDateAdapter } from '@angular/material-moment-adapter';
import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';

import * as _moment from 'moment';

export const MY_FORMATS = {
parse: {
dateInput: 'DD/MM/YYYY',
},
display: {
dateInput: 'DD/MM/YYYY',
monthYearLabel: 'MMM YYYY',
dateA11yLabel: 'DD MM YYYY',
monthYearA11yLabel: 'MMMM YYYY',
},
};


@Component({
selector: 'app-challenge-new',
templateUrl: './challenge-new.component.html',
styleUrls: ['./challenge-new.component.css']
styleUrls: ['./challenge-new.component.css'],
providers: [
// `MomentDateAdapter` can be automatically provided by importing `MomentDateModule` in your
// application's root module. We provide it at the component level here, due to limitations of
// our example generation script.
{ provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE] },

{ provide: MAT_DATE_FORMATS, useValue: MY_FORMATS },
],
})

export class ChallengeNewComponent implements OnInit, OnDestroy {

date = new FormControl();
id: string;
name: string;
sport: string;
@@ -48,13 +74,26 @@ export class ChallengeNewComponent implements OnInit, OnDestroy {
if (form.invalid) {
return;
}
let date = this.date.value._d.getDate();
let month = String(Number(this.date.value._d.getMonth()) + 1);
const year = this.date.value._d.getFullYear();

if (Number(date) < 10) {
date = '0' + date;
}
if (Number(month) < 10) {
month = '0' + month;
}

const dateFinal = date + '/' + month + '/' + year;

this.service.addChallenge(
this.id,
localStorage.getItem('_id'),
this.name,
localStorage.getItem('name'),
this.sport1,
(form.value.date.getDate() + '/' + (form.value.date.getMonth() + 1) + '/' + form.value.date.getFullYear()),
dateFinal,
form.value.time,
form.value.message
);

0 comments on commit a8c8802

Please sign in to comment.