javascript - 如何在 Angular 中为对象添加日期？

问题描述

我正在发送基于这些文件的放置请求。

场地.ts 文件

export class Venue {
    id: number;
    venueName: string;
    cityName: string;
    emailContact: string;
    fighter1: string;
    fighter2: string;
    dateOfFight: Date;
    active: boolean;
}

我的 Angular 组件文件：

创建地点.component.html

<h3>Create Event</h3>
<div [hidden]="submitted" style="width: 400px;">
  <form (ngSubmit)="onSubmit()">
    <div class="form-group">
      <label for="name">Venue Name</label>
      <input type="text" class="form-control" id="venueName" required [(ngModel)]="venue.venueName" name="venueName">
    </div>

    <div class="form-group">
      <label for="name">City Name</label>
      <input type="text" class="form-control" id="cityName" required [(ngModel)]="venue.cityName" name="cityName">
    </div>

    <div class="form-group">
      <label for="name">Email Contact</label>
      <input type="text" class="form-control" id="emailContact" required [(ngModel)]="venue.emailContact" name="emailContact">
    </div>

    <div class="form-group">
      <label for="name">Fighter 1 Contact</label>
      <input type="text" class="form-control" id="fighter1" required [(ngModel)]="venue.fighter1" name="fighter1">
    </div>

    <div class="form-group">
      <label for="name">Fighter 2 Contact</label>
      <input type="text" class="form-control" id="fighter2" required [(ngModel)]="venue.fighter2" name="fighter2">
    </div>
    
    <div class="form-group">
      <label for="name">Choose a time for your Event:</label>
      <input type="datetime-local" class="form-control" id="dateOfFight" min="2021-01-01T00:00" max="2023-06-14T00:00" required [(ngModel)]="venue.dateOfFight" name="dateOfFight">
    </div> 

    <button type="submit" class="btn btn-success">Submit</button>
  </form>
</div>

<div [hidden]="!submitted">
  <h4>You submitted successfully!</h4>
  <!-- <button class="btn btn-success" (click)="newVenue()">Add</button> -->
</div>

创建地点.component.ts

import { VenueService } from '../venue.service';
import { Venue} from '../venue';
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-create-venue',
  templateUrl: './create-venue.component.html',
  styleUrls: ['./create-venue.component.css']
})
export class CreateVenueComponent implements OnInit {

  venue: Venue = new Venue();

  submitted = false;

  constructor(private venueService: VenueService,
    private router: Router) {}


  ngOnInit() {
  }

  newVenue(): void {
    this.submitted = false;
    this.venue = new Venue();
  }

  save() {
    this.venueService.createVenue(this.venue)
    .subscribe(data => console.log(data), error => console.log(error));
    this.venue = new Venue();
    this.gotoList();
  }

  onSubmit() {
    this.submitted = true;
    this.save();    
  }

  gotoList() {
    this.router.navigate(['/venues']);
  }
}

我当前在 chrome 中发送的数据：

我对 javascript 和 Angular 还是很陌生，也许这之前已经回答过了，但我不知道如何将输入数据放入 Venue 对象中......

编辑：这是我的标题标签：我

标签： javascripthtmlangular

javascript - 如何在 Angular 中为对象添加日期？

问题描述

解决方案

推荐阅读