我在角度应用程序中使用bootstrap日期选择器.然而,当我从该日期选择器中选择一个日期选择器时,我已经更新了绑定的ng-model,我想要一个日期格式为'MM/dd/yyyy'的ng-model.但它每次都像这样约会
"2009-02-03T18:30:00.000Z"
Run Code Online (Sandbox Code Playgroud)
代替
02/04/2009
Run Code Online (Sandbox Code Playgroud)
我为同一个plunkr链接创建了一个plunkr
我的Html和控制器代码如下所示
<!doctype html>
<html ng-app="plunker">
<head>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.js"></script>
<script src="//angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.11.0.js"></script>
<script src="example.js"></script>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="DatepickerDemoCtrl">
<pre>Selected date is: <em>{{dt | date:'MM/dd/yyyy' }}</em></pre>
<p>above filter will just update above UI but I want to update actual ng-modle</p>
<h4>Popup</h4>
<div class="row">
<div class="col-md-6">
<p class="input-group">
<input type="text" class="form-control"
datepicker-popup="{{format}}"
ng-model="dt"
is-open="opened" min-date="minDate"
max-date="'2015-06-22'"
datepicker-options="dateOptions"
date-disabled="disabled(date, mode)"
ng-required="true" close-text="Close" />
<span class="input-group-btn">
<button type="button" class="btn btn-default" ng-click="open($event)">
<i class="glyphicon glyphicon-calendar"></i></button>
</span>
</p> …Run Code Online (Sandbox Code Playgroud) datepicker angularjs angular-ui angular-ui-bootstrap angular-ngmodel
角材料介绍找到了一个新的日期选取器组件在这里.
我希望此组件返回的日期格式为yyy-mm-dd,但我不确定这是如何完成的.通过搜索我发现$mdDateLocaleProvider可以使用,但我找不到使用它的例子.
有人能告诉我一个格式化返回日期的工作示例md-datepicker吗?
我试图使用从角UI引导LIB日期选择器组件作为这里descibed:http://angular-ui.github.io/bootstrap/ 我尝试设置选项,在弹出的选择器和accoriding到我应该通过文档使用datepicker-options属性将datepicker选项作为JSON.
在我看来,我有:
<div class="row">
<div class="col-md-6">
<p class="input-group">
<input type="text" class="form-control" datepicker-popup="{{format}}" ng-model="dt" is-open="opened" min="minDate" max="'2015-06-22'" datepicker-options="dateOptions" date-disabled="disabled(date, mode)" ng-required="true" close-text="Close" />
<span class="input-group-btn">
<button class="btn btn-default" ng-click="open($event)"><i class="glyphicon glyphicon-calendar"></i></button>
</span>
</p>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
在我的控制器中,我有:
$scope.dateOptions = {'show-button-bar': 'false', 'close-text':'SomeText'};
$scope.today = function() {
$scope.dt = new Date();
};
$scope.today();
$scope.showWeeks = false;
$scope.clear = function () {
$scope.dt = null;
};
$scope.toggleMin = function() {
$scope.minDate = ( $scope.minDate ) ? null : new Date();
};
$scope.toggleMin(); …Run Code Online (Sandbox Code Playgroud)