作っていてhtml内ではパイプを使って表示ができていますが
ここの意味がちょっとわかりませんが2パターン作ってみました。
- Date型をDatePipeを使用して整形出力するパターン
- datepipe.transformを使用して整形するパターン
app.component.html
html
1<div>{{nowDate | date:'yyyy'}}</div>
2<div>{{getYearOnly()}}</div>
app.component.ts
ts
1import { Component, OnInit } from '@angular/core';
2import { DatePipe } from '@angular/common';
3
4@Component({
5 selector: 'app-root',
6 templateUrl: './app.component.html',
7 styleUrls: ['./app.component.scss']
8})
9export class AppComponent implements OnInit {
10 nowDate: Date;
11
12 constructor(private datepipe: DatePipe) { }
13 ngOnInit(): void {
14 this.nowDate = new Date();
15 }
16
17 getYearOnly() {
18 const d = new Date();
19 return this.datepipe.transform(d, 'yyyy');
20 }
21}
22
補足:検証バージョン
bash
1 _ _ ____ _ ___
2 / \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
3 / △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
4 / ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
5 /_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
6 |___/
7
8
9Angular CLI: 7.2.4
10Node: 8.10.0
11OS: win32 x64
12Angular: 7.2.7
13... animations, common, compiler, compiler-cli, core, forms
14... language-service, platform-browser, platform-browser-dynamic
15... router
16
17Package Version
18-----------------------------------------------------------
19@angular-devkit/architect 0.12.4
20@angular-devkit/build-angular 0.12.4
21@angular-devkit/build-optimizer 0.12.4
22@angular-devkit/build-webpack 0.12.4
23@angular-devkit/core 7.2.4
24@angular-devkit/schematics 7.2.4
25@angular/cli 7.2.4
26@ngtools/webpack 7.2.4
27@schematics/angular 7.2.4
28@schematics/update 0.12.4
29rxjs 6.3.3
30typescript 3.2.4
31webpack 4.28.4
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/03/04 11:03