- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我需要将发布数据发送到 API 服务器。我有一个表单,它有一个日期选择器字段。现在,如果我将数据发送到服务器,它会发送格式为服务器拒绝它的日期。
这是整个数据发送的表示:
{
address: "Address",
department: 1,
dob: "1997-08-19T18:00:00.000Z",
email: "chitholian@gmail.com",
gender: "male",
hall: 1,
id: 16701016,
name: "Atikur Rahman Chitholian",
phone: "No phone number",
religion: "islam",
semester: 1,
session: "2015 - 2016"
}
import {Component, OnInit} from '@angular/core';
import {FormBuilder, FormGroup, Validators} from '@angular/forms';
import {Department, Hall, Semester, Student} from '../custom/interfaces';
import {DepartmentService} from '../services/department.service';
import {MatSnackBar} from '@angular/material';
import {StudentService} from '../services/student.service';
import {Router} from '@angular/router';
import {DatePipe} from '@angular/common';
@Component({
selector: 'app-student-reg',
template: `
<form class="panel" [formGroup]="form" (ngSubmit)="submit()">
<mat-toolbar color="primary">Student Registration</mat-toolbar>
<div class="panel-content of-hidden">
<div class="col-1-2">
<mat-form-field>
<input matInput required type="number" placeholder="Student ID" [formControl]="id" name="id">
<mat-error *ngIf="id.invalid">A valid Student ID is required</mat-error>
</mat-form-field>
<mat-form-field>
<input matInput required placeholder="Full Name" [formControl]="name" name="name">
<mat-error *ngIf="name.invalid">A valid Name is required</mat-error>
</mat-form-field>
<mat-form-field>
<mat-select [formControl]="gender" required placeholder="Gender">
<mat-option *ngFor="let s of genders" [value]="s">{{s|titlecase}}</mat-option>
</mat-select>
<mat-error *ngIf="gender.invalid">Gender is required</mat-error>
</mat-form-field>
<mat-form-field>
<mat-select [formControl]="department" required placeholder="Department" (selectionChange)="onDeptChange()">
<mat-option *ngFor="let d of departments" [value]="d.id">{{d.name}}</mat-option>
</mat-select>
<mat-error *ngIf="department.invalid">A department is required</mat-error>
</mat-form-field>
<mat-form-field>
<mat-select [disabled]="loading > 0 || department.invalid" [formControl]="semester" required placeholder="Semester">
<mat-option *ngFor="let s of semesters" [value]="s.id">Semester {{s.number}}, Year {{s.year}}</mat-option>
</mat-select>
<mat-error *ngIf="semester.invalid">A semester is required</mat-error>
</mat-form-field>
<mat-form-field>
<mat-select [disabled]="loading > 0 || department.invalid || gender.invalid" [formControl]="hall" required placeholder="Hall">
<ng-container *ngFor="let s of halls">
<mat-option *ngIf="s.gender == gender.value" [value]="s.id">{{s.name}}</mat-option>
</ng-container>
</mat-select>
<mat-error *ngIf="hall.invalid">Hall is required</mat-error>
</mat-form-field>
</div>
<div class="col-1-2">
<mat-form-field>
<mat-select [formControl]="religion" required placeholder="Religion">
<mat-option *ngFor="let s of religions" [value]="s">{{s|titlecase}}</mat-option>
</mat-select>
<mat-error *ngIf="religion.invalid">Religion is required</mat-error>
</mat-form-field>
<mat-form-field>
<mat-select [formControl]="session" required placeholder="Session">
<mat-option *ngFor="let s of sessions" [value]="s">{{s}}</mat-option>
</mat-select>
<mat-error *ngIf="session.invalid">Session is required</mat-error>
</mat-form-field>
<mat-form-field>
<input type="email" [formControl]="email" required matInput placeholder="Email" name="email">
<mat-error *ngIf="email.invalid">A valid email address is required</mat-error>
</mat-form-field>
<mat-form-field>
<input [formControl]="phone" maxlength="20" required matInput placeholder="Phone" name="phone">
<mat-error *ngIf="phone.invalid">A valid phone number is required</mat-error>
</mat-form-field>
<mat-form-field>
<input matInput required [formControl]="dob" placeholder="Date of birth" [matDatepicker]="picker"
name="dob">
<mat-datepicker-toggle #toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
<mat-error *ngIf="dob.invalid">A valid date of birth is required</mat-error>
</mat-form-field>
<mat-form-field>
<textarea matInput required cols="2" placeholder="Address" name="address" [formControl]="address"></textarea>
<mat-error *ngIf="address.invalid">Address is required</mat-error>
</mat-form-field>
</div>
<button mat-flat-button type="button" routerLink="/login/student">I have already registered</button>
<button mat-raised-button type="submit" color="primary" class="float-right" [disabled]="loading > 0 || form.invalid">SUBMIT
</button>
</div>
</form>
{{form.value|json}}
`,
styles: []
})
export class StudentRegComponent implements OnInit {
form: FormGroup;
loading = 0;
departments: Department[] = [];
semesters: Semester[] = [];
religions = ['islam', 'hinduism', 'christianity', 'buddhism', 'other'];
genders = ['male', 'female', 'other'];
sessions = [];
halls: Hall[] = [];
get id() {
return this.form.get('id');
}
get semester() {
return this.form.get('semester');
}
get department() {
return this.form.get('department');
}
get hall() {
return this.form.get('hall');
}
get name() {
return this.form.get('name');
}
get gender() {
return this.form.get('gender');
}
get session() {
return this.form.get('session');
}
get phone() {
return this.form.get('phone');
}
get email() {
return this.form.get('email');
}
get address() {
return this.form.get('address');
}
get dob() {
return this.form.get('dob');
}
get religion() {
return this.form.get('religion');
}
constructor(private fb: FormBuilder, private ds: DepartmentService, private router: Router, private ss: StudentService) {
this.form = fb.group({
id: fb.control('', Validators.pattern(/^[1-9]\d{7}$/)),
name: fb.control('', Validators.required),
department: fb.control('', Validators.required),
hall: fb.control('', Validators.required),
semester: fb.control('', Validators.required),
gender: fb.control('', Validators.required),
session: fb.control('', Validators.required),
dob: fb.control('', Validators.required),
religion: fb.control('', Validators.required),
phone: fb.control('', Validators.required),
email: fb.control('', [Validators.required, Validators.email]),
address: fb.control('', Validators.required),
});
}
ngOnInit() {
this.loading++;
this.loadDepartments();
this.generateSessions();
}
submit() {
this.loading++;
this.ss.register(this.form.value).subscribe(
res => {
this.loading--;
this.router.navigate(['/login/student/']);
}, error1 => {
console.log(error1);
this.loading--;
});
}
loadSemesters() {
this.ds.getSemesters(this.department.value).subscribe(
data => {
this.semesters = data;
this.loading--;
}, error => {
this.loading--;
});
}
loadDepartments() {
this.ds.getAllDepartments().subscribe(
data => {
this.departments = data;
this.loading--;
}, error => {
this.loading--;
});
}
loadHalls() {
this.ds.getHalls(this.department.value).subscribe(
data => {
this.halls = data;
this.loading--;
}, error => {
this.loading--;
});
}
generateSessions() {
for (let i = (new Date()).getFullYear(); i > 1966; i--) {
this.sessions.push((i - 1) + ' - ' + i);
}
}
onDeptChange() {
this.loading += 2;
this.loadSemesters();
this.loadHalls();
}
}
date of birth
即
dob
格式为
YYYY-MM-DD
.如何实现这一目标?
最佳答案
您可以使用 Angular's Date Pipe
来实现这一点
Had provided a Stackblitz Demo link as well for reference
@Component({
...,
providers: [ DatePipe ] // Add DatePipe from @angular/common
})
export class SampleComponent {
constructor(...,
private datePipe: DatePipe) {}
submit() {
...
const body = this.form.value;
body.dob = this.datePipe.transform(body.dob, 'yyyy-MM-dd'); // You can provide any date format on the 2nd parameter
this.ss.register(body).subscribe(res => {...});
}
关于Angular 7, react 形式,如何将日期格式化为 'YYYY-MM-DD' ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54576074/
我需要使用正则表达式验证格式为 dd/mm/yyyy 的日期字符串。 此正则表达式验证 dd/mm/yyyy,但不验证 31/02/4500 等无效日期: ^(0?[1-9]|[12][0-9]|3[
我正在开发一个小型应用程序,其中我的表有一列,我必须在其中查找所有具有此格式值的记录 'dd/dd/dd' where d 是数字(1-9)。 例如,我想查找具有这种格式的值的数据'18/32/23'
这个问题不太可能对任何 future 的访客有帮助;它只与一个较小的地理区域、一个特定的时间点或一个非常狭窄的情况相关,通常不适用于全世界的互联网受众。如需帮助使此问题更广泛适用,visit the
我想要 dd.d.dd.ddddd 或 dd.d.d.ddddd 类型的数据的正则表达式,每个 d 代表 0-9 之间的数字,正则表达式应代表这两种格式。我正在使用 java 脚本。我尝试了以下代码。
我已经搜索了该网站,但没有找到接近我需要的答案。基本上我的日期正确显示为“2013-05-09”,但我想要的是“2013 年 3 月 19 日”或使其更好“3 月 19 日, 2013 年”。 请向我
我需要使用 C# 更改日期字符串的格式 来自:“06/16/2010”或“16/06/2010” 至:“2010-06-16” 你能帮我实现这个吗 谢谢 最佳答案 如果您已经将它作为 DateTime
我需要转换当前日期,其格式为: MM|dd|yy --- 12|09|11 我需要将格式转换为: MM/dd/yy --12/09/11 当前系统日期分隔符是:
这个问题在这里已经有了答案: 关闭 10 年前。 Possible Duplicate: Extending JavaScript's Date.parse to allow for DD/MM/Y
我在 Access VBA 中使用 Date 语句编码了一些东西。直到本月初它都运行良好,但现在我看到日期已从 dd/mm/yyyy 自动更改格式至 mm/dd/yyyy .有没有其他人遇到过同样的问
我有一个类似“Apr 17 09:32:01”的日期格式,但我想获取数字中的月份... 是否可以使用logstash进行转换? 我尝试使用日期过滤器,但它似乎无法将日期从一种格式转换为另一种格式。 我
这个问题已经有答案了: How to convert string "2011-11-29 12:34:25" to date in "dd-MM-yyyy" format in JAVA (6 个回
我在前端使用了日期选择器,格式为mm/dd/yyyy,并且我在mysql中选择了日期数据类型,然后如何编写代码将其从yyyy/dd/mm转换为mm/使用 jsp 的 dd/yyy。我已经尝试过代码但不
我想将日期字段(格式:dd-mm-yyyy)转换为数据库日期格式。如果输入日期格式等于 dd-mm-yyyy 格式,则将日期转换为 yyyy-mm-dd 格式,否则返回 false。 function
我正在尝试在 JavaScript 中将日期格式从 mm-dd-yyyy 转换为 yyyy-mm-dd 。我尝试下面的代码获取无效日期。 var convertJSDate = function(da
使用 NSDateFormatter 解析日期。下面的日期是 2013 年 5 月 2 日。我得到不同的结果(如下所示)取决于我是否在 dateFormat 字符串中使用“DD”和“dd” NSStr
在 DateFormatter 中使用 DD 和 dd 有什么区别?搜索时,我没有看到明显的差异。一些日期格式文档显示“DD”和“dd”,有些则没有。 我想了解其中的区别以及为什么它会产生下面评论中显
我在表中有一个以MM/DD/YYYY格式存储的日期列。我必须选择相同的日期并以YYYY-MM-DD格式(即XSD日期格式)存储在另一个表中。但是我做不到。我正在使用此查询: select to_dat
我陷入了这样一种情况:我通过“LOAD DATA LOCAL INFILE”从 CSV 文件读取数据并将其存储在 Mysql 表中。 我的表格中的日期列是字符串类型。 如果我的日期格式为'yy/dd/
我有一个带有两个日期字段的 mysql 表。 Startdate 和 Enddate 是字段我需要使用字段在前端显示日期,例如“2014 年 10 月 24 日至 26 日” 我怎样才能做到这一点?
我有 HTML 显示用户对私有(private)用户配置文件页面上表单中的字段的响应。表单上的字段是有条件的,因此其中许多字段永远不会呈现给用户。 HTML 由系统输出,从未呈现给用户的下拉字段会收到
我是一名优秀的程序员,十分优秀!