get current date with 'yyyy-MM-dd' format in Angular 4

2018-07-12 07:42 Hazem HASAN imported from Stackoverflow

How i can get the current date with a specific format 'yyyy-MM-dd', for today by example i with that the result be: '2018-07-12', with using just the command

myDate = new Date();

thanks a lot

3 answers

answered 2018-07-12 07:45 Peter

Here is the example:

function MethodName($scope)
{
    $scope.date = new Date();
}

You can change the format in view here we have a code

<div ng-app ng-controller="MethodName">
    My current date is {{date | date:'yyyy-MM-dd'}} . 
</div>

I hope it helps.

answered 2018-07-12 07:45 Krishna Rathore
You can use date:'yyyy-MM-dd' pipe
```
curDate=new Date();

<p>{{curDate | date:'yyyy-MM-dd'}}</p>
```

answered 2018-07-12 07:50 khush

You can use DatePipe for formatting Date in Angular.

In ts if you want to format date then you can inject DatePipe as Service in constructor like this

myDate = new Date();
constructor(private datePipe: DatePipe){
    this.myDate = this.datePipe.format(this.myDate, 'yyyy-MM-dd');
}

And if you want to format in html file,

{{myDate | date:'yyyy-MM-dd'}}

As of Angular 6, this also works,

import {formatDate} from '@angular/common';

formatDate(new Date(), 'yyyy/MM/dd', 'en');

See also questions close to this topic

Html 5 video cc button

Would anyone be able to shed some light as to why the Captions and Download button is positioned where it is in the screenshot above, It was positioned correctly so i'm wondering, did google chrome update which has caused something or am i just going mental haha.

I have so far looked into shadow-doom elements but with no success in returning the buttons to their original position.

I'm also interested if others have had a similar problem and if any workarounds/solutions have been found, i am for the purpose of my project not allowed to create any custom controls for the video player so if that was a possible solution it is out :(

Any help will be greatly appreciated, thanks to everyone in advance. :)

Browser is chrome. Enviroment is angular application.

Angular encapsulation and click-outside directive

Problem: I need add a way to bind and close sidebar menu if user click outside that.

I've create a directive (Something like found on this) that check if click is bind outside my element, but when user click exactly on my font-awesome icon on sidebar, it's considered a outside click and menu is not opened (The directive is works good, I checking it clicking on button padding)...

I guess it's a problem on my directive caused by angular encapsulations...

My code:

<aside [ngClass]="{'open': menuStatus}" (clickOutside)="menuStatus = false">
    <button (click)="menuStatusToggle()">
        <fa-icon [icon]="['fas', 'bars']" *ngIf="!menuStatus"></fa-icon>
        <fa-icon [icon]="['fas', 'times']" *ngIf="menuStatus"></fa-icon>
    </button>
    (Menu Content...)
</aside>

Bind event:

@HostListener('document:click', ['$event.target'])
  public onClick(targetElement) {

    // Variable content always false when click on icon of _elementRef
    const clickedInside = this._elementRef.nativeElement.contains(targetElement);

    if (!clickedInside) {
      this.clickOutside.emit(null);
    }
  }

Someone have a suggestion? Encapsulation is really a problem?

How to tell an Rxjs Observable timer to emit the next in sequence immediately

I have tried very hard to tell an rxjs timer to move onto the next sequnce to no avail. Could someone please help me out with this one. I have busted my wits on how to do this. But have not managed it. Here is a sample of code explaining what I am trying to do. I have tried Subjects. I have No matter what I try it seems that you have to somehow throw the subscription away and restart, Even then how?? My comments in the code below should explain what I wish to achieve.

import { Component, OnInit } from '@angular/core';
import { timer } from 'rxjs';
import { takeWhile } from 'rxjs/operators';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
    title = 'testAngular4';
    private condition = false;

  ngOnInit(): void {
    timer(0, 15000).pipe(
      takeWhile((val) => {
      console.log('inside takeWhile', ' val is ', val);
      return val < 30000;
    })).subscribe(value1 => {
      console.log(' subject subscription value is ', value1);
      timer(300, 3000).subscribe((value2) => {
        // Do something here
        console.log(' inside inner timmer subscribe and value is ', value2);
        // How to tell the above timer to emit next value before the 3 seconds
        // have elapsed. This would obviously be based on some condition
        if (this.condition) {
          // Emit the next value in the inner timer sequence above.
          // I mean don't wait any longer - move on. Emit
        }
      });

      // How to tell the above timer to emit next value before the 3 seconds
      // have elapsed. This would obviously be based on some condition
      if (this.condition) {
        // Emit the next value in the outer timer sequence above
        // I mean don't wait any longer - move on. Emit
      }
    });
}

}

Related questions

get current date with 'yyyy-MM-dd' format in Angular 4

3 answers

See also questions close to this topic