Различные значения для одного и того же члена объекта в Angular

Question

следующая функция получает событие от Angular Material Design DatePicker и выводит его на консоль:

  applyFilter(event: MatDatepickerInputEvent<Date>) {

     console.log(`${event.value}`); // prints the selected date

     console.log(event.value); // prints some weird object
  }

Но каждая из них выводит на консоль свой вывод. Первый выводит фактическую выбранную дату, второй выводит на консоль какой-то странный объект.

Это вывод консоли:

This is my DatePicker:

    
        Anfangsdatum
         

Я просто хочу получить дату, выбранную пользователем с помощью DatePicker из Angular Material Design, но это кажется слишком сложным. Кто-нибудь может мне помочь?

Answer 1

Вы видите два разных значения.

Когда вы вызываете console.log(new Date()), вы получаете фактический объект даты. (замените new Date() любым объектом даты, например, вашим event.value)

Это объект weird object, о котором вы говорите. Это просто Date , в котором есть всевозможные методы, которые могут вам помочь. Но, в конце концов, все, что Date - это Number, представляющее миллисекунды с 1 января 1970 г. UT C, а затем множество вспомогательных функций с ним.

Одна из этих вспомогательных функций - .toString().

Когда вы вызываете console.log(`${new Date}`);, вы создаете объект даты, а затем помещаете его в литерал шаблона (обратные кавычки). Этот литерал шаблона вызывает .toString() объекта даты, чтобы преобразовать его в строку, так как вы запрашиваете строку с литералом шаблона. Таким образом, вы получаете строковое представление объекта Date. (На самом деле это немного сложнее, чем в этом сообщении, это не всегда метод toString() для этого сообщения ).

Так что, если вам нужно строковое значение, используйте литерал шаблона или просто позвоните event.value.toString(). Если вам нужен объект даты, чтобы вы могли что-то с ним делать (используйте полный объект даты и все его возможности в соответствии с документацией, приведенной вверху) ... используйте объект даты. Если у вас есть другие вопросы, не стесняйтесь комментировать.

Изменить:

Я не думаю, что это фактический объект даты. Ознакомьтесь с API . Вы получаете ожидаемый объект, но он может быть тем, что описан в этом API. Я заметил, что у них обоих есть метод add в прототипе. В любом случае, это объект или строковое представление. Я попытался найти определение типа, поскольку предполагаю, что вы работаете в Typescript, в котором должны быть перечислены все доступные вам методы.