Угловой 6: дата исчезнет при обновлении

Question

У меня есть текстовое поле, которое позволяет пользователю отправлять комментарии, я хочу получить дату и время отправки комментария и сохранить в json вместе с добавленным комментарием.

К сожалению, когда я отправляю комментарий, комментарий идата отображается, как и ожидалось, но когда я обновляю страницу, дата исчезла.

Примечание использую json-сервер

после отправки комментария вФайл JSON Я хотел бы иметь что-то вроде этого:

"comment": [
    {
  "id": 1,
  "localTime": "2018-10-27T13:42:55",
  "description": "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et lig\n"
}
]

Проблема: Прямо сейчас, когда комментарий отправлен, у меня на сервере json следующее:

 "comment": [
     {
  "id": 1,
  "localTime": null,
  "description": "Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies. Curabitur et lig\n"
}

]

Вот то, что я до сих пор пытался получить дату из введенного комментария.

HTML:

<form class="add-comments" [formGroup]="addForm" (keyup.enter)="addComments()">
      <input type="hidden" id="localTime" name="localTime">
    <div class="form-group">
      <textarea class="form-control" rows="1" placeholder="Add comments" formControlName="description" id="description"></textarea>
    </div>
  </form>

Вот метод на композиты ts.

  addComments(task_id) {
    const formData = this.addForm.value;
    formData.task_id = task_id;
    this.userService.addComments(formData)
    .subscribe(data => {
      this.comments.push(this.addForm.value);
    });
    const date = new Date();
    const d = date.getUTCDate();
    const day = (d < 10) ? '0' + d : d;
    const m = date.getUTCMonth() + 1;
    const month = (m < 10) ? '0' + m : m;
    const year = date.getUTCFullYear();
    const h = date.getUTCHours();
    const hour = (h < 10) ? '0' + h : h;
    const mi = date.getUTCMinutes();
    const minute = (mi < 10) ? '0' + mi : mi;
    const sc = date.getUTCSeconds();
    const second = (sc < 10) ? '0' + sc : sc;
    const loctime = `${year}-${month}-${day}T${hour}:${minute}:${second}`;

    this. addForm.get('localTime').setValue(loctime);

  }

Вот сервис для добавления комментариев на сервер

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import {Status } from '../model/statuses.model';
import { Comment } from '../model/comments.model';
import { User } from '../model/user.model';
@Injectable({
  providedIn: 'root'
})
export class UserService {
  status: Status[];
  constructor(private http: HttpClient) { }
  statusUrl = 'http://localhost:3000/statuses';
  commentsUrl = 'http://localhost:3000/comment';
  usersUrl = 'http://localhost:3000/users';

  addComments(comments: Comment) {
    return this.http.post(this.commentsUrl, comments);
  }
  getComments(id: number) {
    return this.http.get<Comment[]>(this.commentsUrl);
  }


}

Вот модель класса

export class Comment {
    id: number;
    username: string;
    email: string;
    days: number;
    localTime: Date;
    description: string;
}

Что мне нужно изменить, чтобы получить то, что я хочу ??

Answer 1

После этой строки в вашем коде ...

const date = new Date();

... переменная даты уже будет содержать текущую дату и время. Вместо вызова пользовательских функций для построения строки даты, вы также можете просто назначить эту дату своему экземпляру комментария перед отправкой на сервер - так как ваш комментарий будет сериализован в JSON, атрибут даты будет автоматически преобразован в дату строка, соответствующая желаемому формату: "2018-10-27T13:42:55".

Вы можете просто переместить указанную дату в метод addComments вместо этого:

addComments(comments: Comment) {
  comments.localTime = new Date();
  return this.http.post(this.commentsUrl, comments);
}

Answer 2

Используйте localStorage.

// Set localStorage   
localStorage.setItem('nameOfYourKey','data you will save');
// Retrieve data from
 localStorage.getItem('nameofYourKey');