如何在ui-calendar中更改日期格式?

时间:2017-03-22 05:10:05

标签: angularjs ui-calendar

我使用的是角ui-calendar。当我将事件悬停时,它会将事件日期显示为2017-03-12T04:00:00.000Z。在这里,我想将其格式更改为dd-mm-yyyy HH:mm:ss。我附上图片,提到了我的想法,请看图像

enter image description here

这里代码: -

....
....
//loop of n time
vm.events.push({ title: type, className: ['info'], start: new Date(fulldate), info: res.description + '. Assigned :' + res.assignTo.name })
//
        vm.eventSources = [vm.events];

//html code

  <div class="pos-rlt">
                    <div class="fc-overlay">
                        <div class="panel dark-white b-a pos-rlt">
                            <span class="arrow b-white"></span>
                            <div class="h5 _300 m-b-sm b-b p-b-sm">{{event.title}}</div>
                            <div>
                                <i class="fa fa-fw fa-calendar-o text-muted m-r-xs"></i> {{event.start | date:'medium'}}
                            </div>
                            <div class="ng-hide" ng-show='event.end'>
                                <i class="fa fa-fw fa-clock-o text-muted m-r-xs"></i> {{event.end | date:'medium'}}
                            </div>
                            <div class="ng-hide" ng-show='event.location'>
                                <i class="fa fa-fw fa-map-marker text-muted m-r-xs"></i> {{event.location}}
                            </div>
                            <div class="m-t-sm">{{event.info}}</div>
                            <div class="m-t-sm">{{event.url}}</div>
                        </div>
                    </div>
                    <div calendar="calendar" class="calendar" ng-model="eventSources" ui-calendar="uiConfig.calendar"></div>
                </div>

2 个答案:

答案 0 :(得分:2)

您必须更改日期格式。

 <div>
    <i class="fa fa-fw fa-calendar-o text-muted m-r-xs"></i>           
    {{event.start | date:"dd-MM-yyyy HH:mm:ss"}}
 </div>

 <div class="ng-hide" ng-show='event.end'>
    <i class="fa fa-fw fa-clock-o text-muted m-r-xs"></i> 
    {{event.end | date:"dd-MM-yyyy HH:mm:ss"}}
 </div>

答案 1 :(得分:0)

&#13;
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-app="">
<p>Few more formats are:</p>
  {{1288323623006 | date:'medium'}} <br>
  {{1288323623006 | date:'yyyy-MM-dd HH:mm:ss Z'}} <br>
  {{1288323623006 | date:'MM/dd/yyyy @ h:mma'}} <br>
  {{1288323623006 | date:"MM/dd/yyyy 'at' h:mma"}}
</div>
&#13;
&#13;
&#13;

访问该链接以获取完整参考https://docs.angularjs.org/api/ng/filter/date