2017-03-08 141 views
0

我現在用的是引導3日期/時間選擇器(https://github.com/Eonasdan/bootstrap-datetimepicker),我有問題 格式化日期格式日期

<input type="text" id="fmEndDate" class="form-control input-sm" 
          datetimepicker 
          format="DD-MM-YYYY hh:mm" 
          ng-model="workRequest.EndDate" 
          placeholder="..." 
          name="fmEndDate" 
          required        
          ng-disabled="isDisabled"> 

但價值被顯示爲MM/DD/YYYY HH: MM AM

我想31-12-2017 23:59一份新年的時間戳

這是我的指令

"use strict"; 
angular.module("datetimepicker", []) 
.provider("datetimepicker", function() { 
    var defaultOptions = { }; 

this.setOptions = function (options) { 
    defaultOptions = options; 
}; 

this.$get = function() { 
    return { 
    getOptions: function() { 
     return defaultOptions; 
    } 
    }; 
}; 
}) 
.directive("datetimepicker", [ 
"$timeout", 
"datetimepicker", 
function ($timeout,datetimepicker) { 

    var defaultOptions = datetimepicker.getOptions(); 

    return { 
    require : "?ngModel", 
    restrict: "AE", 
    scope : { 
     datetimepickerOptions: "@" 
    }, 
    link : function ($scope, $element, $attrs, ngModelCtrl) { 
     var passedInOptions = $scope.$eval($attrs.datetimepickerOptions); 
     var options = jQuery.extend({}, defaultOptions, passedInOptions); 

     $element 
     .on("dp.change", function (e) { 
      if (ngModelCtrl) { 
      $timeout(function() { 
       ngModelCtrl.$setViewValue(e.target.value); 
      }); 
      } 
     }) 
     .datetimepicker(options); 

     function setPickerValue() { 
     var date = options.defaultDate || null; 

     if (ngModelCtrl && ngModelCtrl.$viewValue) { 
      date = ngModelCtrl.$viewValue; 
     } 

     $element 
      .data("DateTimePicker") 
      .date(date); 
     } 

     if (ngModelCtrl) { 
     ngModelCtrl.$render = function() { 
      setPickerValue(); 
     }; 
     } 

     setPickerValue(); 
    } 
    }; 
} 
]); 

有什麼想法?

+0

嘗試從'格式更改格式= 「DD-MM-YYYY HH:MM」''以格式= 「DD-MM-YYYY HH:MM」'。有關更多信息,請參閱[文檔](https://docs.angularjs.org/api/ng/filter/date)。 – user3366016

+0

@Megajin不是根據角度和[datetimepicker](http://momentjs.com/docs/#/displaying/format/)的文檔。 'hh'將顯示12小時制。 'HH'將顯示24小時制。 – user3366016

+0

對不起,我刪除了我的評論意外。他說他正在使用Bootstrap3 datetimepicker,它與矩陣格式有所不同。你可以看看這個例子:http://eonasdan.github.io/bootstrap-datetimepicker/ – Megajin

回答

0

正如bootstrap3 docs您可以在JavaScript中定義自定義格式顯示:

<div class="container"> 
    <div class="row"> 
     <div class='col-sm-6'> 
      <div class="form-group"> 
       <div class='input-group date' id='datetimepicker3'> 
        <input type='text' class="form-control" /> 
        <span class="input-group-addon"> 
         <span class="glyphicon glyphicon-time"></span> 
        </span> 
       </div> 
      </div> 
     </div> 
     <script type="text/javascript"> 
      $(function() { 
       $('#datetimepicker3').datetimepicker({ 
        format: 'your desired Formatting style' 
       }); 
      }); 
     </script> 
    </div> 
</div> 

更簡單:

$("#fmEndDate").datetimepicker({format: 'dd-mm-yyyy hh:ii'}); 

旁註:小心日期/時間格式:

至於AngularJS HH格式的結果將在00-23小時內完成。而在Bootstrap3中,您也使用HH將導致小時數爲01-12。

我強烈建議你使用像MomentJS這樣的庫,它爲你做了麻煩的工作。

問候, Megajin

+0

謝謝。我看了看jj,我想我會用這個控件替換datetimepicker,而不是https://indrimuska.github.io/angular-moment-picker/ –