ngx moment
6.0.2
MONM.JS管道
该模块可与Angular 7.0.0一起使用，并且更新。
对于较旧的Angular版本，请安装Angular2矩。对于AngularJS，请查看Angular Moment。
npm install --save moment ngx-moment或使用纱线：
yarn add moment ngx-moment将MomentModule导入您的应用程序模块：
import { MomentModule } from 'ngx-moment' ;
@ NgModule ( {
imports : [
MomentModule
]
} )如果您想提供任何可以使用的NgxMomentOptions ，您也可以使用：
import { MomentModule } from 'ngx-moment' ;
@ NgModule ( {
imports : [
MomentModule . forRoot ( {
relativeTimeThresholdOptions : {
'm' : 59
}
} )
]
} )这使所有ngx-moment Pipes都可以在您的应用程序组件中使用。
采用可选的omitSuffix参数，该参数默认为false和另一个可选的formatFn函数，可用于自定义时间以前的文本的格式。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{myDate | amTimeAgo}}
`
} )打印Last updated: a few seconds ago
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{myDate | amTimeAgo:true}}
`
} )打印Last updated: a few seconds
获取可选的referenceTime参数（默认为现在）和可以是输出格式对象或回调函数的formats参数。有关详细信息，请参见MomentJS文档。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{myDate | amCalendar}}
`
} ) Last updated: Today at 14:00 （默认的ReferencEtime今天默认为默认情况下）
@ Component ( {
selector : 'app' ,
template : `
Last updated: <time>{{myDate | amCalendar:nextDay }}</time>
`
} )
export class AppComponent {
nextDay : Date ;
constructor ( ) {
this . nextDay = new Date ( ) ;
nextDay . setDate ( nextDay . getDate ( ) + 1 ) ;
}
} Last updated: Yesterday at 14:00 （参考时期是明天）
@ Component ( {
selector : 'app' ,
template : `
Last updated: <time>{{myDate | amCalendar:{sameDay:'[Same Day at] h:mm A'} }}</time>
`
} )打印Last updated: Same Day at 2:00 PM
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{myDate | amDateFormat:'LL'}}
`
} )印刷Last updated: January 24, 2016
将自定义的日期解析为可以与其他管道一起使用的矩对象。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{'24/01/2014' | amParse:'DD/MM/YYYY' | amDateFormat:'LL'}}
`
} )印刷Last updated: January 24, 2016
管道还可以接受格式作为参数。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{'24/01/2014 22:00' | amParse: formats | amDateFormat:'LL'}}
`
} )
export class App {
formats : string [ ] = [ 'DD/MM/YYYY HH:mm:ss' , 'DD/MM/YYYY HH:mm' ] ;
constructor ( ) { }
}印刷Last updated: January 24, 2016
将UTC时间转换为本地时间。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{mydate | amLocal | amDateFormat: 'YYYY-MM-DD HH:mm'}}
`
} )打印Last updated 2016-01-24 12:34
与AmdateFormat管一起使用以更改语言环境。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{'2016-01-24 14:23:45' | amLocale:'en' | amDateFormat:'MMMM Do YYYY, h:mm:ss a'}}
`
} )印刷Last updated: January 24th 2016, 2:23:45 pm
注意：可能必须导入语言环境（例如，在应用模块中）。
import 'moment/locale/de' ; @ Component ( {
selector : 'app' ,
template : `
Last updated: {{ (1456263980 | amFromUnix) | amDateFormat:'hh:mmA'}}
`
} )打印Last updated: 01:46PM
@ Component ( {
selector : 'app' ,
template : `
Uptime: {{ 365 | amDuration:'seconds' }}
`
} )打印Uptime: 6 minutes
@ Component ( {
selector : 'app' ,
template : `
Expiration: {{nextDay | amDifference: today :'days' : true}} days
`
} )打印Expiration: 1 days
使用这些管道执行日期算术。有关详细信息，请参见MomentJS文档。
@ Component ( {
selector : 'app' ,
template : `
Expiration: {{'2017-03-17T16:55:00.000+01:00' | amAdd: 2 : 'hours' | amDateFormat: 'YYYY-MM-DD HH:mm'}}
`
} )印刷品Expiration: 2017-03-17 18:55
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{'2017-03-17T16:55:00.000+01:00' | amSubtract: 5 : 'years' | amDateFormat: 'YYYY-MM-DD HH:mm'}}
`
} )印刷Last updated: 2012-03-17 16:55
将日期解析为UTC的日期，并启用模式以进行后续时刻操作（例如在UTC中显示时间）。可以将其与amLocal结合使用，以在当地时间显示UTC日期。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{ '2016-12-31T23:00:00.000-01:00' | amFromUtc | amDateFormat: 'YYYY-MM-DD' }}
`
} )打印Last updated: 2017-01-01
也可以指定与标准ISO8601不同格式。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{ '31/12/2016 23:00-01:00' | amFromUtc: 'DD/MM/YYYY HH:mmZZ' | amDateFormat: 'YYYY-MM-DD' }}
`
} )甚至一系列格式：
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{ '31/12/2016 23:00-01:00' | amFromUtc: formats | amDateFormat: 'YYYY-MM-DD' }}
`
} )
export class App {
formats : string [ ] = [ 'DD/MM/YYYY HH:mm:ss' , 'DD/MM/YYYY HH:mmZZ' ] ;
constructor ( ) { }
}上面的两个示例将打印Last updated: 2017-01-01
启用UTC模式以进行后续瞬间操作（例如在UTC中显示时间）。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{ '2016-12-31T23:00:00.000-01:00' | amUtc | amDateFormat: 'YYYY-MM-DD' }}
`
} )打印Last updated: 2017-01-01
解析字符串，但将结果矩对象保留在固定偏移时区中，并在字符串中提供的偏移量。
@ Component ( {
selector : 'app' ,
template : `
Last updated: {{ '2016-12-31T23:00:00.000-03:00' | amParseZone | amDateFormat: 'LLLL (Z)' }}
`
} )印刷Last updated: Saturday, December 31, 2016 11:00 PM (-03:00)
检查片刻是否在另一个时刻。支持将粒度限制到以外的单位以外的单位，将单元作为第二参数传递
@ Component ( {
selector : 'app' ,
template : `
Today is before tomorrow: {{ today | amIsBefore:tomorrow:'day' }}
`
} ) Today is before tomorrow: true
@ Component ( {
selector : 'app' ,
template : `
Tomorrow is after today: {{ tomorrow | amIsAfter:today:'day' }}
`
} ) Tomorrow is after today: true
可以使用forRoot约定向模块提供NgxMomentOptions对象，并将为管道提供的选项与moment实例一起使用，这些选项在下表中详细介绍：
| 支柱 | 类型 | 描述 |
|---|---|---|
| 相关甲基股权 | 字典 键：字符串 值：数字 | 提供relativeTimeThreshold单位，允许管道设置moment.relativeTimeThreshold 。key是一个定义为ss ， s ， m ， h ， d ， M的单元。有关更多详细信息，请参见相对时间阈值文档。 |
import { NgModule , Component } from '@angular/core' ;
import { BrowserModule } from '@angular/platform-browser' ;
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic' ;
import { MomentModule } from 'ngx-moment' ;
@ Component ( {
selector : 'app' ,
template : `
Last updated: <b>{{myDate | amTimeAgo}}</b>, <b>{{myDate | amCalendar}}</b>, <b>{{myDate | amDateFormat:'LL'}}</b>
`
} )
export class AppComponent {
myDate : Date ;
constructor ( ) {
this . myDate = new Date ( ) ;
}
}
@ NgModule ( {
imports : [
BrowserModule ,
MomentModule
] ,
declarations : [ AppComponent ]
bootstrap : [ AppComponent ]
} )
class AppModule { }
platformBrowserDynamic ( ) . bootstrapModule ( AppModule ) ; 在Stackblitz上查看在线演示
