我在HTML中有以下代码,并使用Angular v 1.6.3和https://github.com/indrimuska/angular-moment-picker中的角矩选择器。我想使用格式DD-MM-YYYY
显示日历。
<div moment-picker="member.memberSince"
format="DD-MM-YYYY"
max-view="month"
start-view="month"
autoclose="true"
today="true"
ng-model="member.memberSince"
start-date="member.memberSince | date : 'dd-MM-yyyy'">
{{ member.memberSince | date : 'dd-MM-yyyy' || "Select a date" }}
</div>
我有两个问题
当我在页面加载时从JS代码设置
member.memberSince
时,日期为显示良好,例如
01-04-2017
。但是当我从中选择日期时日历,它以不想要的格式显示日期,例如
Sat Apr 01 2017 00:00:00 GMT+0530
。如果我没有设置
member.memberSince
,那么我在选择日历的页面上看不到任何控件。
我应该如何解决这个问题?
Plunker
最佳答案
这里有多个问题。
让我们先来看docs | angular-moment-picker
#options
moment-picker
:双向可绑定属性,格式为日期时间字符串。
ng-model
:双向可绑定属性,作为Moment.js对象。
现在,出于明显的原因,我们不应该将两者都设置为相同的属性。如果您为ng-model
提供了相同的属性,那么它似乎具有优越性,并将该属性设置为Moment.js对象。
接下来,当您拥有{{memberSince | date : 'dd-MM-yyyy' || "Select a date"}}
(其中memberSince
设置为ng-model
)时,它最初具有一个string
/ Date
对象。但是,当您选择一个日期时,它再次成为明显不符合date:'<my-dateformat>'
的Moment.js对象。
解决您的问题的方法(如果您还没有弄清楚的话)将是删除设置为指令的ng-model
。而且您可以从memberSince
自由访问moment-picker="memberSince"
,因为它是您提供的格式(即DD-MM-YYYY
)中的格式化字符串。
在HTML中,您可以使用{{ memberSince || "Select a date" }}
而不需要使用Angular的date
过滤器,因为memberSince
只是一个包含所提供格式的选定日期的字符串。
working plunker