Angular 6 - Struggling to translate "Invalid Date" to a valid date using the "DatePipe" filter

Greetings,

I am encountering an issue related to converting dates into a specific format that I desire.

Currently, the REST API is sending dates in Milliseconds format, which I need to convert to a date format like yyyy-MM-dd for my date-picker component.

The error message states,

Unable to convert "Invalid Date" into a date for pipe "DatePipe".

For your reference - https://i.sstatic.net/8HREA.png

This is a snippet of my code:

this.rest.getprofiledata()
           .((resp) =>{
           this.data = resp;
           this.personal = this.data["message"];
           this.d = new Date(this.personal.dob);
           this.personal.dob = this.d;
               var day = this.d.getDate();
               var mon = this.d.getMonth();
               var year = this.d.getFullYear();
               var dy = this.d.getDay();
               dt = new Date(dy,mon,year);
               this.personal.dob = dt
           } );

Answer №1

There have been numerous times when I incorporated the date in my work

Present day's date is {{myDate | date:'yyyy-MM-dd':'UTC'}}

It has proven to be effective for me

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The Angular web browser's back button feature

I'm looking to add a pop on the browser back button feature in my Angular application. I've tried using both popstate and the Angular location API, but haven't had much success. Can anyone provide a solution or suggestion for this issue? I& ...

Using NGRX with Angular's AuthGuard

Having trouble using AuthGuard with NGRX - I keep getting undefined on a specific route: Even though Store shows that estaAutenticado is true, I'm not able to access it in time - could this be due to async behavior? Here's my guard implementati ...

How to use AngularJS directives to replace text with stars (*) in HTML

I am in need of a textarea control that has the ability to be masked, meaning that the text displayed should appear as stars instead of the actual characters. Since I might have multiple textareas in my form, saving the actual text in one variable and usi ...

Tips for passing configuration constants from HTML to a class in Angular 2 for reusing classes

Suppose I am looking to efficiently reuse my Angular 2 components, how can I input configuration directly into the HTML and then pass it to the respective class? However, could this method be vulnerable to potential manipulation in the HTML code by unautho ...

The DefaultTheme in MaterialUI no longer recognizes the 'palette' property after transitioning from v4 to v5, causing it to stop functioning correctly

Currently in the process of transitioning my app from Material UI v4 to v5 and encountering a few challenges. One issue I'm facing is that the 'palette' property is not recognized by DefaultTheme from Material UI when used in makeStyles. Thi ...

`mat chip component in Angular Material is malfunctioning`

Whenever I input a string, it does not display properly within the designated textbox. HTML <mat-form-field class="favorite-fruits"> <mat-label>Favorite Fruits</mat-label> <mat-chip-list #chipList aria- ...

Tips for implementing a hover effect across the entire line in a line chart using Chart.js

initializeChart(): void { var myGraph = new Chart('myGraph', { type: 'bar', data: { labels: ['Modes'], datasets: [ { label: 'A', data: [this.data.a], borderColor: ' ...

The sorting functionality in Angular 8's mat-table behaves in a unique way, where uppercase and lowercase characters are sorted separately, along with numbers and null

My data table, built using mat table, is functioning flawlessly with one exception - sorting. The issue arises when the data contains a mix of upper and lower case words, resulting in separate sorting for lowercase, uppercase, numbers, and null values. Des ...

Volta alert: Temporary directory creation failed

Recently, I attempted to globally download and install TypeScript using the npm install -g typescript command in my terminal. Unfortunately, an error occurred: Volta error: Could not create temporary directory in /Users/username/.volta/tmp/image/packages ...

Encountering an issue with the Angular router-outlet: Unable to find any matching routes for the specified

I must apologize as I have searched extensively for a solution to my problem, but unfortunately, I have not been successful despite numerous attempts. Currently, I am working with Angular version 13.3.9 I am attempting to utilize the outlet router functi ...

Transferring objects between components using Angular 9's router

Currently, I am utilizing the most recent versions of Angular 9 and Node.js. Below, you will find a snippet of the code: Extracted from app.component <router-outlet></router-outlet> Extracted from app.component.ts import { Component, OnInit ...

Creating and troubleshooting an Angular 7 project in Visual Studio 2017

After setting up my angular7 project with the ng new my-app command (following the steps at https://angular.io/guide/setup-local), I wanted to continue developing and debugging using Visual Studio 2017 (not Visual Studio Code). When attempting to use Visu ...

Determine the types of values for an object through the use of Generics

After spending a while pondering over this issue, I have yet to discover an elegant solution. My dilemma begins with an Enum: export enum Enum { A, B, C, } Next, there is an object that utilizes the Enum. While the structure is somewhat predi ...

File or directory does not exist: ENOENT error encountered when attempting to access 'distrowserindex.html'

Upon executing ng deploy --preview, an error is encountered: Error: ENOENT: no such file or directory, open 'dist\index.html' at Object.openSync (fs.js:457:3) at readFileSync (fs.js:359:35) Despite attempting various online tutorial ...

The error message TS2322 occurs due to the inability to assign the type 'Observable<{}[]>' to 'Observable<Archive[][]>'

While upgrading from Angular 5.2.11 to 7.3.9, I encountered a types issue that was not present in the previous version of Angular. After fixing the import for forkJoin, the code snippet below now throws an error: ERROR in src/app/reports/report-measureme ...

In Angular, the data retrieved from the API will only appear on the page once it has been manually

Recently, I started working on an Angular project and encountered a problem with data display after each component routing. Initially, the data is not displayed until the page is reloaded. You can see the issue in the screenshots: https://i.sstatic.net/5My ...

Objects in the array are failing to sort in the expected sequence

I am facing an issue with sorting an array of objects by a date property using the lodash function orderBy. I have tried to sort it in both ascending and descending order. var searchObj = [{id: 1, postDate: '2/24/2016 5:08 PM'}, ...

Having trouble retrieving the Angular CLI version even after ensuring all the necessary requirements are installed?

I am facing challenges with using the Angular CLI. I have successfully installed Node, NPM, and Angular, as confirmed by running the which command in the terminal showing their locations in /user/local/bin. The current version of my node.js is v11.8.0. T ...

Preventing image rotation in an Angular 4 application: Strategies and Solutions

My Angular application allows users to choose a profile picture. During testing, I discovered that when I upload images from an iPhone in portrait mode, they appear rotated in my app. However, when the photos are taken in landscape mode, they display corre ...

Tips for finding the most efficient route from a specific point on a 2D plane using an array of location objects

I am working with an array that contains objects representing various locations, and I am trying to find the closest point to a specific starting point. //location array let locations=[ { x_axis:900, y_axis:900, }, { x_axis:800, y_axis:800, }, { x_ax ...